HTML DOMドキュメントgetElementsByTagName()
例
タグ名が「li」のすべての要素を取得します。
const collection = document.getElementsByTagName("li");
ドキュメント内のすべての要素を取得します。
const collection = document.getElementsByTagName("*");
ドキュメントの最初の<p>要素の内部HTMLを変更します。
document.getElementsByTagName("p")[0].innerHTML = "Hello World!";
以下のその他の例。
定義と使用法
このgetElementsByTagName()
メソッドは、指定されたタグ名を持つすべての要素のコレクションを返します。
このgetElementsByTagName()
メソッドはHTMLCollectionを返します。
getElementsByTagName()
プロパティは読み取り専用です。
ノート
getElementsByTagName("*")
ドキュメント内のすべての要素を返します。
HTMLCollection
HTMLCollectionは、HTMLノードのコレクションです。
コレクション内のノードには、インデックス番号でアクセスできます。インデックスは0から始まります。
lengthプロパティは、コレクション内の要素の数を返します。
構文
document.getElementsByTagName(tagname)
パラメーター
Parameter | Description |
tagname | Required. The tagname of the elements. |
戻り値
タイプ | 説明 |
物体 | HTMLCollectionオブジェクト。 指定されたタグ名を持つ要素のコレクション。 要素は、ドキュメントに表示されるとおりに並べ替えられます。 |
その他の例
ドキュメント内の<li>要素の数:
let numb = document.getElementsByTagName("li").length;
すべての<p>要素の背景色を変更します。
const collection = document.getElementsByTagName("P");
for (let i = 0; i < collection.length; i++) {
collection[i].style.backgroundColor = "red";
}
関連ページ
JavaScriptリファレンス:element .getElementsByTagName()
JavaScriptチュートリアル:JavaScript HTMLDOMノードリスト
ブラウザのサポート
document.getElementsByTagName()
DOMレベル1(1998)の機能です。
すべてのブラウザで完全にサポートされています。
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |