querySelectAll()

Javascriptインスタンスチュートリアル:querySelectorAll()メソッド
querySelectorAll()はquerySelector()と同じ2つのパラメータ、すなわちCSSクエリとオプションのネーミングスペース解析器を受け入れますが、単一ではなくすべての一致するノードが返されます.このメソッドは、StaticNodeListという新しいタイプのインスタンスを返します.
名前の通り、StaticNodeListにはNodeListのすべてのプロパティとメソッドがありますが、その下位レベルの実装は、常にドキュメントに対する動的クエリーを再実行するのではなく、要素セットのスナップショットです.StaticNodeListを使用すると、NodeListオブジェクトを使用することによるパフォーマンスの問題の大部分が解消されます.
querySelectorAll()を呼び出すと、一致する要素がいくつあるかにかかわらず、StaticNodeListオブジェクトが返されます.一致しない場合、StaticNodeListは空です.querySelectorAll()はquerySelector()と同様にDocumentやElementタイプに存在します.以下に例を示します.

//  <div>      （ getElementsByTaName("img")  ）
var images = document.getElementById("myDiv").querySelectorAll("img");

//      “selected”    
var selected = document.querySelectorall(".selected");

//    <p>    <strong>  
var strongs = document.querySelectorAll("p strong");

返されるStaticNodeListオブジェクトは、NodeListと同様に反復され、item()または角カッコタグを使用して単一の要素を取得できます.次の例を示します.

for (var i = 0, len = strongs.length; i < len; i++) {
    var strong = strong[i]; // strongs.item(i)
    strong.className = "important";
}

次の例に示すように、querySelectorAll()で名前空間解析器を使用できます.

var svgImages = document.querySelectorAll("svg|svg", function (prefix) {
    switch (prefix) {
        return "http://www.w3.org/2000/svg";
        //      
    }
});