Introdução
Retorna uma lista de elementos presentes no documento (usando ordenação em profundidade, pré-ordenada e transversal dos nós do documento) que coincidam com o grupo de seletores especificado. O objeto retornado é uma NodeList.
Sintaxe
elementList = document.querySelectorAll(selectors);
onde
elementListé umaNodeListnão-viva (alterações no DOM não refletem na lista) de objetosElement.selectorsé uma string contendo um ou mais seletores CSS separados por vírgulas.
A NodeList retornada irá conter todos os elementos do documento que coincidam com os seletores especificados. Se a string selectors conter um CSS pseudoelements, o retorno será uma NodeList vazia.
Exemplo
Esse exemplo retorna uma lista de todos os elementos div presentes no document que contenham as classes "note" ou "alert":
var matches = document.querySelectorAll("div.note, div.alert");
Notas
Retorna uma NodeList não-viva (alterações no DOM não refletem na lista) de todos os elementos que coincidam com os seletores informados.
Lança uma exceção SYNTAX_ERR se o grupo especificado de seletores for inválido.
querySelectorAll() foi introduzida na WebApps API.
Navegadores baseados em WebKit têm um bug: quando a string seletores contém um pseudo-elemento CSS, a NodeList retornada não esta vazia, neste caso ela contém o elemento <html>.
Compatibilidade nos navegadores
| Possui | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Suporte básico | 1 | 3.5 (1.9.1) | 8 | 10 | 3.2 (525.3) |
| Possui | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Suporte básico | 2.1 | sim | 9 | 10.0 | 3.2 |