querySelectorAll

Lição 9 de 13 do curso Métodos DOM do JavaScript da Coddy.

A função querySelectorAll() retorna uma coleção de todos os elementos que correspondem a um seletor estilo CSS, semelhante ao querySelector, mas permitindo que você capture todos os elementos correspondentes de uma só vez.

const elements = document.querySelectorAll(".other");

O código acima recupera todos os elementos com o nome de classe other.

Desafio

Fácil

Você recebeu um código HTML que contém dois spans.

Usando apenas JavaScript, altere o estilo de todos os elementos, usando a função querySelectorAll:

backgroundColor para "pink"
border para "1px solid red"

Experimente você mesmo

<!DOCTYPE html>
<html>
    <body>
        <span class="error">Error 1</span>
        <span class="error">Error 2</span>
        <script src="script.js"></script>
    </body>
</html>

Todas as lições de Métodos DOM do JavaScript

1Introdução

Introdução Document Object Model

2Métodos do DOM I

getElementById Modificar Estilo do Elemento getElementsByClassName Percorrer e Manipular getElementsByTagName querySelector

3Métodos do DOM II

querySelectorAlladdEventListener innerHTML createElement e appendChild classList toggle