Zusammenfassung
Gibt alle Elemente des Dokuments zurück, auf die die Gruppe der übergebenen CSS Selektoren zutrifft. Der Document-Tree wird dabei mittels Tiefensuche in pre-order Traversierung durchsucht. Das zurückgegebene Objekt ist eine NodeList.
Syntax
elementList = document.querySelectorAll(selectors);
wobei
elementListist eine nicht-liveNodeListderelementObjekte.selectorsist ein string der ein oder mehrere CSS Selektoren (durch ein Komma getrennt) enthält.
Die zurückgegebene NodeList enthält alle Elemente im Document, auf die einer der übergebenen CSS Selektoren zutrifft. Wenn der selectors string ein CSS pseudo-element enthält, wird die zurückgegebene elementList null sein.
Beispiel
Das Beispiel liefert eine Liste aller div-Elemente im document, die die CSS Klasse "note" oder "alert" haben:
var matches = document.querySelectorAll("div.note, div.alert");
Anmerkungen
Liefert eine non-live NodeList aller passenden Elemente.
Wirft eine SYNTAX_ERR Exception wenn die Gruppe der Selektoren ungültig ist.
querySelectorAll() wurde in der WebApps API eingeführt.
WebKit Browser haben einen Fehler (Bug): Wenn der selectors string CSS pseudo-element enthält, ist die zurückgegebene elementList nicht leer (empty) sondern enthält das <html> Element.
Der string Parameter, der an querySelectorAll übergeben wird muss der CSS Syntax entsprechen. Siehe dazu document.querySelector für konrekte Beispiele
Browser Kompatibilität
Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | 1 | 3.5 (1.9.1) | 9 8 (CSS2 selectors only) |
10 | 3.2 (525.3) |
| Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | 2.1 | yes | 9 | 10.0 | 3.2 |