Renvoie la liste des éléments dans le document (en partant du premier niveau du html et ordonné comme les noeuds du document) qui correspondent au groupe de sélecteurs passés en paramètre. L'objet retourné est une collection de noeuds NodeList.

Note : La définition de cet API a été déplacée vers l'interface ParentNode .

Syntaxe

elements = document.querySelectorAll(selecteurs);

Le NodeList renvoyé contiendra tous les élements du document qui correspondent au groupe de sélecteurs passés en paramètre . si la chaîne selecteurs contient un pseudo-element, la collection elementList retournée sera vide.

Exemples

Cet exemple renvoie la liste de tous les éléments div du document dont l'attribut de classe a pour valeur "note" ou "alert" :

var matches = document.querySelectorAll("div.note, div.alert");

Cet autre exemple montre une utilisation dans une fonction .

function getElements(elmSel) {
    return document.querySelectorAll(elmSel);
}  

getElements(".note");

Notes

Renvoie un élément indirect de type  NodeList de tous les noeuds correspondants.

Relève une exception SYNTAX_ERR si le sélecteur spécifié est invalide.

querySelectorAll() a été ajouté dans l'API WebApps.

La chaîne de caractères passée en argument à la méthode querySelectorAll doit suivre la syntaxe CSS. Pour des exemples concrets, voir ce lien document.querySelector.

Spécification

Spécification Statut Commentaire
Selectors API Level 1
La définition de 'document.querySelector()' dans cette spécification.
Obsolete Définition initiale.

Compatibilité des navigateurs

Nous convertissons les données de compatibilité dans un format JSON. Ce tableau de compatibilité utilise encore l'ancien format car nous n'avons pas encore converti les données qu'il contient. Vous pouvez nous aider en contribuant !

Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1 (Oui) 3.5 9
8[1]
10 3.2
Fonctionnalité Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 (Oui) (Oui) 9 10.0 3.2

[1] Internet Explorer 8 prend en charge seulement les sélecteurs CSS2.

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : loella16, fkhannouf, tym-network, DCK, micetf
 Dernière mise à jour par : loella16,