JavaScript HTML DOM Коллекция
Объект HTML Коллекция
Метод getElementsByTagName()
возвращает объект HTMLCollection
.
Объект HTMLCollection
является массивом, как список (коллекция) элементов HTML.
Следующий код выбирает все <p>
элементы в документе:
Пример
varx = document.getElementsByTagName("p");
Доступ к элементам в коллекции можно получить по порядковому номеру.
Чтобы получить доступ ко второму элементу <p>, вы можете написать:
y = x[1];
Попробуйте сами »
Примечание: индекс начинается с 0.
HTML Длина HTMLCollection
Свойство length
определяет количество элементов в HTMLCollection
:
Пример
var myCollection = document.getElementsByTagName("p");
document.getElementById("demo").innerHTML = myCollection.length;
Попробуйте сами »
Объяснение примера:
- Создайте коллекцию всех
<p>
элементов - Показать длину коллекции
Свойство length
полезно, когда вы хотите перебирать элементы в коллекции:
Пример
Измените цвет фона всех элементов <p>:
var myCollection = document.getElementsByTagName("p");
var i;
for (i = 0; i < myCollection.length; i++) {
myCollection[i].style.color = "red";
}
Попробуйте сами »
HTMLCollection НЕ является массивом!
HTMLCollection может выглядеть как массив, но это не так.
Вы можете перемещаться по списку и ссылаться на элементы с помощью числа (как в массиве).
Однако вы не можете использовать методы массива, такие как valueOf(), pop(), push(), или join() в HTMLCollection.