Метод getElementsByClassName() в JavaScript
Метод getElementsByClassName
позволяет находить все элементы, которые имеют определённый класс на странице. Это полезный инструмент, когда нужно работать с группой элементов, объединённых одним стилем или функцией.
document.getElementsByClassName(class);
Метод позволяет передавать один или несколько классов, например просто menu
либо header menu
Метод возвращает HTMLCollection
— живую коллекцию, содержащую все элементы с указанным классом. Если на странице таких элементов нет, вернётся пустая коллекция.
Запуск поиска по странице по определенному классу
let boxes = document.getElementsByClassName('box');
console.log(boxes);
// Выведет коллекцию всех элементов с классом "box"
Теперь поменяю цвет всех элементов с классом box
for (let item of boxes) {
item.style.background = 'yellow';
}
Метод getElementsByClassName
— быстрый и удобный способ получить группу элементов по классу. Однако, если требуется статичный список или сложный CSS-селектор, лучше использовать querySelectorAll
.