HTMLCollection
HTMLCollection 接口代表一个通用集合（类似数组的对象，类似于 arguments），其中包含元素（按文档顺序），并提供用于从列表中选择的方法和属性。
HTML DOM 中的 HTMLCollection 是实时的（live）；当底层文档发生更改时，它会自动更新。因此，如果需要添加、移动或删除节点，最好制作一份副本（例如，使用 Array.from）进行迭代。
此接口之所以命名为 HTMLCollection 是出于历史原因，因为在现代 DOM 之前，实现此接口的集合只能包含 HTML 元素作为其项。
这个接口曾是 创建不可修改列表的尝试，并且至今仍然被支持，以免破坏现有代码。现代 API 使用基于 JavaScript 数组 的类型来表示列表结构，从而提供了许多数组方法，同时对其使用施加了额外的语义（例如，使其项只读）。
这些历史原因并不意味着作为开发人员，您应该避免使用 HTMLCollection。您不会自己创建 HTMLCollection 对象，而是通过诸如 Document.getElementsByClassName() 之类的 API 获取它们，并且这些 API 并未被弃用。但是，请注意与真实数组的语义差异。
实例属性
HTMLCollection.length只读-
返回集合中的项数。
实例方法
HTMLCollection.item()-
返回列表中给定从零开始的
index处的特定元素。如果index超出范围，则返回null。这是访问
collection[i]的替代方法（当i超出范围时，后者返回undefined）。这主要对非 JavaScript DOM 实现有用。 HTMLCollection.namedItem()-
返回其 ID 或（作为备用）名称与
name指定的字符串匹配的特定节点。按名称匹配仅作为最后手段，仅在 HTML 中进行，并且仅当引用的元素支持name属性时。如果没有给定名称的节点存在，则返回null。这是访问
collection[name]的替代方法（当name不存在时，后者返回undefined）。这主要对非 JavaScript DOM 实现有用。
JavaScript 中的用法
HTMLCollection 也通过名称和索引将其成员作为属性公开。HTML ID 可能包含 : 和 . 作为有效字符，这将需要使用方括号表示法进行属性访问。目前，HTMLCollection 对象不识别纯数字 ID，这会与数组式访问产生冲突，尽管 HTML 允许这些 ID。
例如，假设文档中有一个 <form> 元素，其 id 为 myForm
let elem1, elem2;
// document.forms is an HTMLCollection
elem1 = document.forms[0];
elem2 = document.forms.item(0);
alert(elem1 === elem2); // shows: "true"
elem1 = document.forms.myForm;
elem2 = document.forms.namedItem("myForm");
alert(elem1 === elem2); // shows: "true"
elem1 = document.forms["named.item.with.periods"];
规范
| 规范 |
|---|
| DOM # 接口-htmlcollection |
浏览器兼容性
加载中…