Javascript 的“for in”应该是这样吗？构造迭代长度属性？

Question

我正在制作一个小书签，但我在 IE8 中遇到了一些奇怪的行为。导致问题的代码是这样的：

var els = document.getElementById("my_id").getElementsByTagName("*");
for(var i in els)
{
    alert(i+","+els[i])
}

首先发出警报的是“length, n”。在 chrome 中并非如此：仅在 IE8 中如此。

有趣的是，它的行为似乎有所不同，具体取决于代码是否位于控制台/地址栏或页面本身。

这是标准行为吗？

编辑：

也不是我运行它的网站。 getElementsByTagName 是否有可能返回一个在 IE 中设置有 "length" 键的数组？它当然不会返回纯数组。

Answer 1

这是我迭代列表的方法。这样，您就不必在循环中编写额外的行，例如 var el = els[i]。

var els = document.getElementById("my_id").getElementsByTagName("*");
for (var i=0, el; el=els[i]; i++) {
    // do what you like here
}

Answer 2

除非您为 NodeList 定义自己的迭代器（仅限 JavaScript (Mozilla)）。 [这是我为 js-iterators 存储库创建的一个实现]。

Answer 3

将对象（如节点列表、参数对象或自定义对象）转换为其成员数组的方法通常很有用。

Array.from= function(what){
 var L, A= [];
 if(!what) what= {};
 L= what.length;
 if(typeof L== 'number'){
  while(L) A[--L]= what[L];
  return A;
 }
 for(var p in what){
  if(what.hasOwnProperty(p)) A[A.length]= what[p];
 }
 return A;
}

var N=Array.from(document.getElementById("my_id").getElementsByTagName("*"))
while(N.length){
tem=N.shift();
}

Answer 4

你得到的不是一个数组，而是一个nodeList。
请参阅此处，单击链接“getElementsByTagName('element_name')”

此外，无论如何，for..in 并不意味着用于迭代数组。用于

var item;
for (var idx=0, len=arr.length; idx<len; ++idx) {
  item = arr[idx];
  // whatever
}

数组迭代。

可以使用 获取元素。

list.item(idx); // where list is what you got from getElementsByTagName

对于节点列表，如果您想“正确”地执行操作，则

Answer 5

IE 的行为是正确的。它可能会返回各种奇怪的东西，因为 for .. in 会迭代对象的所有成员名称。

getElementsByTagName 返回一个 NodeList，并且 NodeList 的属性在 DOM 标准：长度 和 <代码>项目(i)。大多数 JavaScript 实现也允许 [i]。

因此，您应该编写以下内容：

var els = document.getElementById("my_id").getElementsByTagName("*");
for (var i = 0;i < els.length;i++)
{
    alert(i+","+els.item(i));
}

Answer 6

除了枚举对象的属性之外，请勿将 for..in 用于任何其他用途（除非您喜欢惊喜！）只需对数组和节点列表使用简单的 for 循环。