備忘録的プログラミングリファレンス

HTMLCollection インターフェイス

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

HTMLCollection 継承図

リストから Element を取得する方法

 エレメントをリストである 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

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

HTMLCollection を継承するインターフェイス

HTMLCollection を返すメソッド

 querySelectorAll()NodeList を返します。

プロパティ(Properties)

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

プロパティ概要分類

メソッド(Methods)

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

メソッド概要分類

イベント(Event)

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

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