Безплатно! Онлайн събитие: 5-дневно ChatGPT предизвикателство Регистрация тук.
Още селектори - заявки
Пълен достъп до курса: Не
За пълен достъп или безплатна проба (2 модула), моля влезте или се регистрирайте.
querySelector – гъвкавият начин за работа с DOM
querySelector и querySelectorAll позволяват да селектирате DOM елементи по същия начин, по който ги избирате в CSS. Най-важното е, че можете да използвате сложни и вложени селектори, без да пишете дълги и трудни за четене комбинации от getElementsByTagName. querySelector връща само първия намерен елемент, а querySelectorAll – всички елементи, които отговарят на условието.
Стъпка по стъпка: как да използвате заявки
- Извикайте
document.querySelector()и подайте CSS селектор като текст в кавички. - За вложена структура използвайте същия синтаксис като в CSS (напр.
main aside ul li). - Ако искате всички съвпадения, използвайте
document.querySelectorAll(). - За избор по ID използвайте
#id. - За избор по class използвайте
.className.
Пример:
- селекция по ID → #MyImage
- селекция по class → .profile
Основни методи
querySelector– връща първия елемент, който отговаря на CSS селектора.querySelectorAll– връща всички съвпадащи елементи като колекция (NodeList).#id– CSS синтаксис за селектиране по ID..className– CSS синтаксис за селектиране по клас.
Този подход обединява гъвкавостта на CSS селекторите с мощта на JavaScript и значително улеснява работата с DOM дървото.
