O document.querySelectorAll()
retorna uma lista de elementos DOM ( NodeList
) com base em uma string de seletor CSS.
O código a seguir retorna todos os <div>
elementos do documento:
var divs = document.querySelectorAll('div');
Linguagem de código: JavaScript ( javascript )
O código a seguir retorna todos os <div>
elementos com uma classe error
ou warning
:
let divs = document.querySelectorAll("div.error, div.warning");
Linguagem de código: JavaScript ( javascript )
Veja o seguinte trecho de HTML:
<div id="container">
<p class="note">This is a note</p>
<p class="note">This is another note</p>
<p class="error">An error message</p>
<div>
Linguagem de código: HTML, XML ( xml )
A seguir obtém-se uma lista de p
elementos da classe note
que estão localizados dentro de outra div
cujo id é container
.
let container = document.querySelector("#container");
let matches = container.querySelectorAll("p.note");
Linguagem de código: JavaScript ( javascript )
Depois de encontrar as correspondências, você pode processá-las como um array. Se a matriz estiver vazia, nenhuma correspondência foi encontrada.
O código a seguir exclui todos os <p>
elementos com a classe note
encontrada no exemplo anterior:
matches.forEach(function(match) {
match.parentNode.removeChild(match);
});
Linguagem de código: PHP ( php )