HTML DOM NodeList item() メソッド

定義と使用法

item() methodはNodeList内の指定されたインデックスの节点を返します。

指定されたインデックスの节点にアクセスする方法は2種類あります:

list.item(index)

または

list[index]

最もシンプルで最も一般的な方法は [index]。

例 1

<body> 要素の子节点を取得します:

const nodeList = document.body.childNodes;

実際に試してみる

例 2

最初の子节点のノード名を取得します:

const list = document.body.childNodes;
let name = list.item(0).nodeName;

実際に試してみる

例 3

この例の結果は同じです:

const list = document.body.childNodes;
let name = list[0].nodeName;

実際に試してみる

例 4

ドキュメント内の最初の <p> 要素の HTML 内容を取得します:

const list = document.getElementsByTagName("p");
let text = list.item(0).innerHTML;

実際に試してみる

例 5

"myDIV" 内の最初の <p> 要素の HTML コンテンツを取得:

const div = document.getElementById("myDIV");
const list = div.getElementsByTagName("p");
let text = list[0].innerHTML;

実際に試してみる

例 6

"myDIV" 内の最初の <p> 要素の HTML コンテンツを変更:

const div = document.getElementById("myDIV");
const list = div.getElementsByTagName("p");
let text = list[0].innerHTML = "Paragraph changed";

実際に試してみる

例 7

class="child" のすべての要素の色を変更:

const list = document.querySelectorAll(".child");
for (let i = 0; i < list.length; i++) {
  list[i].style.color = "red";
}

実際に試してみる

構文

nodelist.item(index)

または短縮して:

nodelist[index]

パラメータ

パラメータ 説明
index

必須。リスト内のノードのインデックス(インデックス)。

ノードは文書内での出現順序に従って並べられます。

インデックスは 0 から始まります。

返り値

タイプ 説明
オブジェクト 指定された索引のノード。
null 索引が範囲外の場合。

ブラウザのサポート

nodelist.item() は DOM Level 1 (1998) の機能です。

すべての現代ブラウザがサポートしています:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
サポート 9-11 サポート サポート サポート サポート

関連ページ

length 属性

entries() メソッド

forEach() メソッド

keys() メソッド

values() メソッド

NodeList オブジェクト

childNodes() メソッド

querySelectorAll() メソッド

getElementsByName() メソッド