HTMLCollection インターフェイス

　HTMLCollection インターフェイスは、Element オブジェクトのリストを定義したインターフェイスです。
　このインターフェイスのプロパティ、メソッドを定義しています。

　HTMLCollection オブジェクトは、.getElementsByTagName メソッドのように返り値が複数のエレメントである場合に使用されます。

HTMLCollection 継承図

- ad -

HTMLCollection インターフェイスについて

　ここでは、以下について解説します。

　HTMLCollection を返すメソッドには以下があります。

　querySelectorAll() は NodeList を返します。

　エレメントをリストである HTMLCollection オブジェクトから Element を取得する方法は、インデックスから取得するか、name または id 属性から取得する、for 関数で該当するエレメントを取得するがあります。

getElementsByTagName()メソッド　インデックスから取得する

var elements_ = document.getElementsByTagName("p");
console.log( elements_[0] );

getElementsByTagName()メソッド　name または id 属性から取得する

var elements_ = document.getElementsByTagName("p");
console.log( elements_.namedItem('example') );

getElementsByTagName()メソッド　for 関数で取得する

var elements_ = document.getElementsByTagName("p");
for (let i = 0; i < elements_.length; i++){
		console.log( elements_[i] );
}

　name または id 属性から取得する方法は、該当する最初のエレメントを返します。

　似たものに NodeList があります。 HTMLCollection は動的、内容の変化によって取得したリストの内容も変化します。
　NodeList は静的です。内容が変化しても取得したリストの内容は変化しません。

　HTMLCollection インターフェイスは以下のプロパティをもちます。

プロパティ	概要	分類

　HTMLCollection インターフェイスは以下のメソッドがあります。

メソッド	概要	分類

　HTMLCollection　はオブジェクトのリストで、イベントハンドラーを設定する方法はありません。

　イベントについての記載はありません。

- ad -