概要
与えられた CSS セレクタにマッチする文書中の要素（※深さ優先の先行順走査によるもの）の全てのリスト (NodeList) を返します。
構文
elementList = document.querySelectorAll(selectors);
※返される NodeList オブジェクトには、指定セレクタに一致する文書内のすべての要素が含まれます。 selectors に CSS 疑似要素の文字列を含めた場合、elementList は空になります。
例
文書中の、 "lightbox" または "popup" のクラス名を持つすべての div 要素のノードリストを返します。
var matches = document.querySelectorAll( "div.lightbox, div.popup" );
注記
戻り値はマッチした要素のライブなものでない NodeList です。
もし指定したセレクタグループが valid なものでない場合、 SYNTAX_ERR 例外がスローされます。
querySelectorAll() は WebApps API より導入されたものです。
WebKit ブラウザのバグ : selectors 文字列に CSS pseudo-element が含まれる場合、戻り値の elementList は空ではなく <html> 要素となります。
querySelectorAll に渡す引数は、CSS の構文に準じるものでなくてはなりません。具体的な例については document.querySelector のページを参照してください。
ブラウザ実装状況
| 機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| 基本サポート | 1 | 3.5 (1.9.1) | 9 8 (CSS2 selectors only) |
10 | 3.2 (525.3) |
| 機能 | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| 基本サポート | 2.1 | yes | 9 | 10.0 | 3.2 |