Question

我有这样的HTML代码：

 <body>
  <div id="vis">
   <div id="loading-container"><img src="img/loading.gif" id="loading" /><img src="img/loaded.gif" id="loaded" /></div>
  </div>
 </body>

在vis div中，动态添加更多元素，它们都具有相同的标记类型：

<svg class="example" width="800" height="400"></svg>

我希望得到所有svg元素，我已经这样做了：

var visDiv = document.getElementById("vis");
var svgDiv = visDiv.getElementsByTagName("svg");

我正在尝试迭代svgDiv，但是即使有多个元素，它也会输出0的长度。当我在console.log svgDiv时得到：

SVG: [item: function, namedItem: function]
      0: svg
      1: svg
      length: 2
      __proto__: HTMLCollection

这似乎是一个显而易见的问题，但我怎样才能访问＆＃34; 0＆＃34; ＆安培; ＆＃34; 1＆＃34;对象

svgDiv["item"][0]会产生undefined。

感谢任何帮助！

Answer 1

尝试

svgDiv[0]

因为

visDiv.getElementsByTagName("svg");

返回包含标签“svg”的所有元素的数组，并且您想要访问它的第一个（或通常是第n个）元素。
Fiddle

Answer 2

svgDiv以HTML collection.的形式返回 - 您应该能够使用

获取这些元素

svgDiv.item(0)
svgDiv.item(1)

访问JavaScript数组值

2 个答案: