querySelector() / querySelectorAll()
method
Select DOM elements using CSS selector syntax. querySelector returns one; querySelectorAll returns a NodeList.
Syntax
document.querySelector(selector) document.querySelectorAll(selector)
Example
javascript
// Select single element
const btn = document.querySelector('#submit-btn');
const nav = document.querySelector('nav');
const first = document.querySelector('.card');
// Select all matching elements
const allCards = document.querySelectorAll('.card');
const inputs = document.querySelectorAll('input[type="text"]');
// Iterate NodeList
allCards.forEach(card => {
card.classList.add('loaded');
});