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 |
瀏覽器相容性
載入中…