JavaScript HTML DOM ノードリスト

NodeListオブジェクトは、ドキュメントから取得したノードリスト（コレクション）です。

NodeList オブジェクトは類似していますHTMLCollectionオブジェクトです。

一部の旧バージョンのブラウザのメソッド（例：getElementsByClassName()）は、HTMLCollection オブジェクトではなく NodeList オブジェクトを返します。

すべてのブラウザのchildNodesプロパティは NodeList オブジェクトを返します。

ほとんどのブラウザのquerySelectorAll()NodeList オブジェクトを返します。

次のコードは、ドキュメント内のすべての <p> ノードを選択します：

NodeList オブジェクトの length プロパティ

NodeList オブジェクトの length プロパティは、ノードリスト内の要素の数を定義します。

サンプルの解説

<p> 要素のコレクションを取得：

var myNodelist = document.querySelectorAll("p");

ノードリストの要素数を表示：

document.getElementById("demo").innerHTML = myNodelist.length;

length プロパティは、ノードリストを走査するためによく使用されます。

HTMLCollection と NodeList の違い

HTMLCollectionHTML 要素のコレクションです。

NodeList はドキュメントノードのコレクションです。

NodeList と HTMLCollection には多くの類似点があります。

NodeList と HTMLCollection はどちらも配列オブジェクトに少し似ており、インデックス (0, 1, 2, 3, 4, ...) を使用して要素を取得できます。

NodeList と HTMLCollection はどちらも length プロパティを持っています。

HTMLCollection の要素は、name、id、またはインデックスで取得できます。

NodeList はインデックスでのみ取得できます。

NodeList オブジェクトのみが属性ノードとテキストノードを含みます。

ノードリストは配列ではありません！

ノードリストは配列のように見えるかもしれませんが、実際にはそうではありません。

配列のようにインデックスを使用して要素を取得できます。

ノードリストは配列のメソッド（valueOf(), pop(), push(), または join()）を使用できません。