Коллекции JavaScript H TML DOM

Объект HTMLCollection

Метод getElementsByTagName()возвращает HTMLCollectionобъект.

Объект HTMLCollectionпредставляет собой похожий на массив список (коллекцию) элементов HTML.

Следующий код выбирает все <p>элементы в документе:

const myCollection = document.getElementsByTagName("p");

Доступ к элементам в коллекции можно получить по номеру индекса.

Чтобы получить доступ ко второму элементу <p>, вы можете написать:

myCollection[1]

Примечание. Индекс начинается с 0.

Свойство lengthопределяет количество элементов в HTMLCollection:

myCollection.length

Свойство lengthполезно, когда вы хотите перебирать элементы в коллекции:

Измените цвет текста всех элементов <p>:

const myCollection = document.getElementsByTagName("p");
for (let i = 0; i < myCollection.length; i++) {
myCollection[i].style.color = "red";
}

HTMLCollection НЕ является массивом!

HTMLCollection может выглядеть как массив, но это не так.

Вы можете пройтись по списку и обратиться к элементам с номером (точно так же, как массив).

Однако вы не можете использовать методы массива, такие как valueOf(), pop(), push() или join() в HTMLCollection.