HTMLCollection

Интерфейс HTMLCollection представляет собой общую коллекцию (массивоподобный объект, похожий на arguments) элементов (в порядке документа) и предоставляет методы и свойства для выбора из списка.

Объект HTMLCollection в HTML DOM является динамическим; он автоматически обновляется при изменении основного документа. По этой причине рекомендуется создавать копию (например, используя Array.from), чтобы перебирать элементы при добавлении, перемещении или удалении узлов.

Этот интерфейс называется HTMLCollection по историческим причинам, потому что до современного DOM коллекции, реализующие этот интерфейс, могли содержать только HTML-элементы.

Этот интерфейс был попыткой создать неизменяемый список и продолжает поддерживаться только для того, чтобы не сломать код, который уже его использует. Современные API представляют структуры списков с использованием типов, основанных на JavaScript массивах, что делает доступными многие методы массивов и одновременно накладывает дополнительные семантические ограничения на их использование (например, делает их элементы только для чтения).

Эти исторические причины не означают, что вам, как разработчику, следует избегать HTMLCollection. Вы сами не создаёте объекты HTMLCollection, но получаете их из API, таких как Document.getElementsByClassName(), и эти API не устарели. Однако будьте внимательны к семантическим различиям с реальным массивом.

HTMLCollection.length Только для чтения

Возвращает количество элементов в коллекции.

HTMLCollection.item()

Возвращает конкретный элемент по заданному нулевому index в списке. Возвращает null если index находится вне диапазона.

Альтернатива доступу к collection[i] (которая вместо этого возвращает undefined при выходе i за пределы). Это в основном полезно для не-JavaScript DOM-реализаций.

HTMLCollection.namedItem()

Возвращает конкретный узел, идентификатор или, как резервный вариант, имя которого совпадает со строкой, указанной в name. Сопоставление по имени выполняется только как крайняя мера, только в HTML и только если у соответствующего элемента есть атрибут name. Возвращает null , если узел с указанным именем не существует.

Альтернатива доступу к collection[name] (которая вместо этого возвращает undefined если name не существует). Это в основном полезно для не-JavaScript DOM-реализаций.

HTMLCollection также предоставляет доступ к своим членам по имени и индексу. Идентификаторы HTML могут содержать : и . в качестве допустимых символов, что потребовало бы использования квадратных скобок для доступа к свойствам. В настоящее время объект HTMLCollection не распознает чисто числовые идентификаторы, которые могли бы вызвать конфликт со стилем доступа к массивам, хотя HTML разрешает такие идентификаторы.

Например, предположим, что в документе существует один элемент <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"];

• NodeList
• HTMLFormControlsCollection, HTMLOptionsCollection