svg中js的问题。

Question

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-flat-20030114.dtd">
<svg width ="640" height="480" onload="init(evt);">
  <script>
    <![CDATA[
    
    function init(evt){
      svgDoc = evt.target.ownerDocument;
      getGElements();
    }
    
    function getGElements(){
      var gElements = svgDoc.getElementsByTagName("g");
      alert(gElements);
      alert(gElements.length);
      for (var i = 0; i < gElements.length; i++){
         alert(gElements[i].nodeName);
      }
      g = svgDoc.getElementById("g1");
      alert(g.nodeName);
    }
    
  ]]>
  </script>
  <g id="g1"></g>
  <g id="Value1">
    <rect id="r1" x="100" y="100" width="50" height="30" stroke="black" stroke-width="2" fill="none"/>
    <text id="Textl" x="125" y="125" fill="#000000" stroke="none" font-family="Arial" font-size="20" font-weight="bold" text-anchor="middle" >8.67</text>
  </g>
  <g id="g2"></g>
  <g id="g3"></g>
  <g id="g4"></g>
</svg>
为什么我在 alert(gElements[i].nodeName); 的时候会提示nodeName为空或不是对象呢？
gElements 明明是个g标记的数组，长度是5。
而且    g = svgDoc.getElementById("g1");  alert(g.nodeName);    这样写就没有错误。

Answer 1

<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="640" height="480" onload="init(evt);" version="1.1"
     xmlns="http://www.w3.org/2000/svg">
  <script>
    <![CDATA[
    
    function init(evt){
      svgDoc = evt.target.ownerDocument;
      getGElements();
    }
    
    function getGElements(){
      var gElements = svgDoc.getElementsByTagName("g");
      alert(gElements);
      alert(gElements.length);
      for (var i = 0; i < gElements.length; i++){
         alert(gElements[i].nodeName);
      }
      g = svgDoc.getElementById("g1");
      alert(g.nodeName);
    }
    
  ]]>
  </script>
  <g id="g1"></g>
  <g id="Value1">
    <rect id="r1" x="100" y="100" width="50" height="30" stroke="black" stroke-width="2" fill="none"/>
    <text id="Textl" x="125" y="125" fill="#000000" stroke="none" font-family="Arial" font-size="20" font-weight="bold" text-anchor="middle" >8.67</text>
  </g>
  <g id="g2"></g>
  <g id="g3"></g>
  <g id="g4"></g>
</svg>

Answer 2

这样还是不行呀。  还是说'nodeName'为空或不是对象。

Answer 3

2楼的代码真不行求教啊，感觉svg里的nodeList很奇怪啊

Answer 4

firefox,safari，chrome,opera浏览器里都显示正常的
IE9之前不支持svg，原来的那个SvgViewer插件很老了

Answer 5

我就是用的SvgViewer插件 - - 

Answer 6

需求就是在IE浏览器下利用SvgViewer查看SVG的。
然后我想为id为"Value"开头的g标记添加一个onClick事件。
根据2楼的方案，我写了一个能在FF上实现的js，可是在IE上不可以。
有没有一个可以在IE上实现的方法？
求高手。

Answer 7

这样写
for (var i = 0; i < gElements.length; i++){
         alert(gElements.item(i).nodeName);
      }