具有2个不同长度的数组？ [复制]答案

【问题标题】：Array with 2 different lengths? [duplicate]具有2个不同长度的数组？ [复制]
【发布时间】：2015-08-21 06:58:28
【问题描述】：

我使用以下方法创建了一个数组：

var links = document.getElementsByTagName('a');

如果我这样做：

console.log(links.length);

我得到：2。

但是，如果我这样做：

console.log(links);

我得到一个看起来像这样的对象：

[a.elm-skip-link, a]

当我展开这个对象时，里面有 33 个链接对象。

为什么链接对象的长度会发生变化？如果它是一个数组，它不会保留它创建时的大小吗？

这是我正在使用的所有代码：

var links = document.getElementsByTagName('a');
console.log('links:');
console.log(links);
console.log('length:');
console.log(links.length);

顺便说一句：我正在尝试在页面上选择一个没有“id”或“class”属性的特定链接，所以我需要获取所有链接，然后遍历它们以找到一个具有我正在寻找的“标题”属性。然而，当我尝试遍历这个“链接”对象时，尽管页面上有 33 个链接，但循环只运行了两次。

【问题讨论】：

首先，这不是一个数组，它是一个node list
请注意：有一个 document.links 集合是页面中的所有链接。元素不一定是链接。此外，getElementsByTagName 返回一个 NodeList，而不是一个数组。
由于 HTMLCollection 的行为（我不知道），这个问题不是 console.log 同步或异步问题的重复。我知道 console.log 不是异步的，但我不知道 HTMLCollection 对象的特殊行为。

【解决方案1】：

getElementsByTagName 实际上并没有返回一个数组，它返回一个类似对象的数组，它是活的HTMLCollection。

实时意味着任何时候 DOM 被修改，集合（或返回的类似对象的数组）都会被修改。

所以，如果我不得不冒险猜测一下，我会假设您在第一次调用此函数时您的 DOM 没有完全加载。它返回的集合只包含其中两个元素，它们被发送到控制台。

稍后，当您展开 set 时，DOM 已被修改，您会看到生成的 33 个元素。

【讨论】：