Esta tradução está incompleta. Ajude atraduzir este artigo.
Sumário
Retorna uma NodeList
de todos os elementos descendentes do elemento que foi invocado que sejam compatíveis com o grupo de seletores CSS especificados.
Sintaxe
elementList = baseElement.querySelectorAll(selectors);
where
elementList
is a non-live list of element objects.baseElement
é um objeto elemento.selectors
é um grupo de seletores que serão procurados.
Exemplos
Este exemplo retorna uma lista de todos os elementos p
no corpo do HTML:
var matches = document.body.querySelectorAll('p');
Este exemplo retorna uma lista de elementos p
que estejam contidos em outro elemento, o qual é uma div
que tem a classe 'highlighted':
var el = document.querySelector('#test'); var matches = el.querySelectorAll('div.highlighted > p');
Este exemplo retorna uma lista de elementos iframe
que contenham um atributo data 'src':
var matches = el.querySelectorAll('iframe[data-src]');
Notas
Joga uma excessão SYNTAX_ERR
se o grupo especificado de seletores for inválido.
querySelectorAll()
foi introduzida na WebApps API.
A string passada como argumento para querySelectorAll
deve seguir a sintaxe do CSS. veja document.querySelector
para um exemplo concreto.
Lembre-se que o valor retornado é uma NodeList, então não é recomendado o uso de recursões for...in, nem de nenhum método de array. Se realmente houver a necessidade de usar métodos de uma array, então o NodeList deve ser convertido em uma array antes de ser usado.
Compatibilidade com Browsers
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Suporte básico | 1 | 3.5 (1.9.1) | 8 | 10 | 3.2 (525.3) |
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Suporte básico | (Yes) | 1.0 (1.9.1) | ? | ? | (Yes) |