firefox js getSVGDocument().getElementsByClassName('myClass') broken？

Question

我有一个嵌入式SVG，使用js改变20个路径填充颜色，所有具有相同的类。

<script>
function svgMod(){  
    //var links = document.getElementById("tornado5").getSVGDocument().
    //    getElementsByClassName('SVGlogo');
    var links = document.getElementById("tornado5").contentDocument.
        getElementsByClassName('SVGlogo');
    for (var i=0;i<links.length;i++) { links[i].style.fill="00ff00"; }  
}
</script>
<object type="image/svg+xml" id="tornado5" data="bitmaps/frames/tornado2.svg">
</object>        <!-- cant use img -->
<button onclick="svgMod();" >Click to change</button>

它适用于Chrome，但不适用firefox。我尝试了两个contentDocument和getvgdocument()，但没有帮助。链接。长度是20，即使在firefox中，所以问题似乎是在链接[i].style.fill

任何想法?

Answer 1

你能试着改变这一行吗?

for (var i=0;i<links.length;i++) { links[i].style.fill="00ff00"; } 

:

for (var i=0; i < links.length; i++) {
    links[i].setAttribute("fill", "#00ff00");
} 

或

for (var i=0; i < links.length; i++) {
    links[i].style.fill = "#00ff00";
}