最新のWeb開発のチュートリアル
 

HTML DOM getElementsByTagName() Method

<Elementオブジェクト

例

最初のHTMLコンテンツの変更<li>要素(index 0)リストの中に：

var list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("LI")[0].innerHTML = "Milk";

テキストを変更する前に：

  • Coffee
  • Tea

テキストを変更後：

  • Milk
  • Tea
»それを自分で試してみてください

定義と使用法

getElementsByTagName()メソッドは、NodeListオブジェクトとして、指定されたタグ名を持つ要素の子要素のコレクションを返します。

NodeListオブジェクトは、ノードの集合を表します。 ノードは、インデックス番号によってアクセスすることができます。 インデックスは0から始まります。

ヒント：あなたが使用することができ、長さ 、あなたは、すべてのノードをループして、必要な情報を抽出することができ、指定したタグ名で子ノードの数を決定するためにNodeListオブジェクトのプロパティを。

ヒント：parametervalue "*"要素の子要素のすべてを返します。

ブラウザのサポート

表中の数字は完全に方法をサポートする最初のブラウザのバージョンを指定します。

方法
getElementsByTagName() 1.0 6.0 3.0 3.0 9.5

構文

element .getElementsByTagName( tagname )

パラメータ値

パラメーター タイプ 説明
tagname String 必須。 あなたが取得したい子要素のタグ名

技術的な詳細

DOMバージョン コアレベル1要素オブジェクト
戻り値： 指定されたタグ名を持つ要素の子要素のコレクションを表すNodeListオブジェクト、。 彼らはソースコードに表示される返されたコレクション内の要素がソートされています。
例

その他の例

例

どのように多くを見つける<p>の内側にある要素<div> （NodeListオブジェクトのlengthプロパティを使用して）要素：

var x = document.getElementById("myDIV").getElementsByTagName("P").length;

xの結果は次のようになります。

3
»それを自分で試してみてください

例

第二の背景色変更<p>要素(index 1)の内部<div>要素。

var x = document.getElementById("myDIV");
x.getElementsByTagName("P")[1].style.backgroundColor = "red";
»それを自分で試してみてください

例

すべての背景色の変更<p>内の要素<div>要素を：

var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("P");
var i;
for (i = 0; i < y.length; i++) {
    y[i].style.backgroundColor = "red";
}
»それを自分で試してみてください

例

第4要素の背景色を変更(index 3)の内部<div>要素。

var x = document.getElementById("myDIV");
x.getElementsByTagName("*")[3].style.backgroundColor = "red";
»それを自分で試してみてください

例

使用方法"*"パラメータを。

内のすべての要素の背景色の変更<div>要素を：

var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("*");
var i;
for (i = 0; i < y.length; i++) {
    y[i].style.backgroundColor = "red";
}
»それを自分で試してみてください

関連ページ

JavaScriptのリファレンス： ドキュメント。 getElementsByTagName()

JavaScriptのチュートリアル： JavaScriptのHTML DOMノードリスト

<Elementオブジェクト