querySelectorAll()
Обновлено: 20.03.2023
Визначення та використання
Метод querySelectorAll() повертає колекцію дочірніх елементів елемента, які відповідають указаному селектору(ам) CSS, як статичний об’єкт NodeList.
Приклад
Встановіть колір тла першого елемента за допомогою class="example" всередині елемента <div>:
// Get the element with id="myDIV" (a div), then get all elements inside div with class="example"
var x = document.getElementById("myDIV").querySelectorAll(".example");
// Set the background color of the first element with class="example" (index 0) in div
x[0].style.backgroundColor = "red";NodeList
NodeList — це колекція (список) вузлів у вигляді масиву .
До вузлів у списку можна отримати доступ за індексом. Індекс починається з 0.
Довжина Poperty повертає кількість вузлів у списку.
Підтримка браузера
Синтаксис
element.querySelectorAll(CSS selectors)
Значення параметрів
| Параметр | Тип | Опи |
|---|---|---|
| CSS selectors | String | Вимагається. Визначає один або кілька селекторів CSS для відповідності елементу. Вони використовуються для вибору елементів HTML на основі їх ідентифікатора, класів, типів, атрибутів, значень атрибутів тощо. Для кількох селекторів розділяйте кожен селектор комою. |
Технічні деталі
| Версія DOM: | Об’єкт документа рівня 1 селектора |
|---|---|
| Повернене значення: | Об’єкт NodeList, що представляє всі елементи-нащадки поточного елемента, який відповідає вказаному селектору(ам) CSS. NodeList — це статична колекція, тобто зміни в DOM НЕ впливають на колекцію. Примітка. Викидає виняток SYNTAX_ERR, якщо вказаний селектор(и) недійсний |