NodeList - 节点的集合

NodeList 对象是节点的集合，通常由诸如 Node.childNodes 之类的属性以及诸如 document.querySelectorAll() 之类的方法返回。

尽管 NodeList 不是一个 Array，但是可以使用 forEach() 对其进行迭代。也可以使用 Array.from() 转换为真正的 Array 。
但是，某些较旧的浏览器尚未实现 NodeList.forEach() 或 Array.from()。可以通过使用 Array.prototype.forEach() 来避免这种情况 - 请参阅本文档的实例。

在某些情况下， NodeList 是实时的，这意味着 DOM 中的更改会自动更新集合。例如，Node.childNodes 是实时的：

var parent = document.getElementById('parent');
var child_nodes = parent.childNodes;
console.log(child_nodes.length); // 让我们假设为 "2"
parent.appendChild(document.createElement('div'));
console.log(child_nodes.length); // 输出 "3"

在其他情况下，NodeList是静态的，其中 DOM 中的任何更改都不会影响集合的内容。 document.querySelectorAll() 返回静态的 NodeList。

在选择如何遍历 NodeList 中的项目以及是否应缓存列表的长度时，最好记住这一区别。

属性

NodeList.length

NodeList 中的节点数。

方法

NodeList.item()

按索引返回列表中的一项；如果索引超出范围，则返回 null。

通过 nodeList[i] 访问是一种替代方法（当 i 越界时，它返回 undefined）。这对于非 JavaScript 语言的 DOM 实现最有用。

NodeList.entries()

返回一个 iterator，允许代码遍历集合中包含的所有键 / 值对。 （在这种情况下，键是从 0 开始的数字，而值是节点。）

NodeList.forEach()

每个 NodeList 元素执行一次提供的函数，并将该元素作为参数传递给该函数。

NodeList.keys()

返回一个 iterator，允许代码遍历集合中包含的键 / 值对的所有键。 （在这种情况下，键是从 0 开始的数字。）

NodeList.values()

返回一个 iterator，允许代码遍历集合中包含的键 / 值对的所有值（节点）。

实例

可以使用 for 循环遍历 NodeList 中的项目：

for (var i = 0; i < myNodeList.length; i++) {
  var item = myNodeList[i];
}

不要使用 for...in 或 for each...in 来枚举 NodeList 中的项目，因为它们还会枚举其 length 和 item 属性，并且如果您的脚本假定它只需要处理元素对象，则会导致错误。同样，不能保证 for..in 可以按任何特定顺序访问属性。

for...of 循环将正确遍历 NodeList 对象：

var list = document.querySelectorAll('input[type=checkbox]');
for (var checkbox of list) {
  checkbox.checked = true;
}

最新的浏览器还支持迭代器方法（forEach()）以及 entries()， values() 和 keys()。

还有一种 Internet Explorer 兼容的方法，可以使用 Array.prototype.forEach 进行迭代：

var list = document.querySelectorAll('input[type=checkbox]');
Array.prototype.forEach.call(list, function (checkbox) {
  checkbox.checked = true;
});

规范

规范	状态	备注
DOM NodeList 的定义	现行的标准	-
Document Object Model (DOM) Level 3 Core Specification NodeList 的定义	已过时	-
Document Object Model (DOM) Level 2 Core Specification NodeList 的定义	已过时	-
Document Object Model (DOM) Level 1 Specification NodeList 的定义	已过时	初始定义。

桌面浏览器兼容性

移动浏览器兼容性