Table rows コレクション

HTML DOM Table オブジェクト

定義と使用法

rows コレクションはテーブル内のすべての <tr> 要素のコレクションを返します。

注釈：コレクション内の要素はソースコード内での出現順序に従って並べ替えられます。

ヒント：使用してください insertRow() メソッド 新しい行 (<tr>) を作成します。

ヒント：使用してください deleteRow() メソッド 行を削除します。

ヒント：使用してください insertCell() メソッド 新しいセル（<td>）を作成します。

ヒント：使用してください deleteCell() メソッド セルを削除します。

ヒント：使用してください cells コレクション テーブル内のすべての <td> または <th> 元素の集合を返します。

も参照してください：

HTML リファレンスマニュアル：HTML <tr> タグ

JavaScript リファレンスマニュアル：HTML DOM TableRow オブジェクト

例

例 1

テーブルの行数を確認します：

var x = document.getElementById("myTable").rows.length;

実際に試してみる

xの結果は：

2

例 2：[index]

テーブル内の最初の <tr> 元素（インデックス 0）の innerHTML を表示します：

alert(document.getElementById("myTable").rows[0].innerHTML;

実際に試してみる

例 3：item(index)

テーブル内の最初の <tr> 元素（インデックス 0）の innerHTML を表示します：

alert(document.getElementById("myTable").rows.item(0).innerHTML);

実際に試してみる

例 4：namedItem(id)

テーブル内の id="myRow" の <tr> 元素の innerHTML を表示します：

alert(document.getElementById("myTable").rows.namedItem("myRow").innerHTML);

実際に試してみる

例 5

最初のテーブルセルの内容を変更します：

var x = document.getElementById("myTable").rows[0].cells;
x[0].innerHTML = "NEW CONTENT";

実際に試してみる

文法

tableObject.rows

属性

属性 説明
length

コレクション内の <tr> 元素の数を返します。

注釈：この属性は読み取り専用です。

メソッド

メソッド 説明
[index]

指定された索引の <tr> 元素（0から始まる）を含むコレクションを返します。

注釈：索引番号が範囲外の場合、null を返します。
item(index)

指定された索引の <tr> 元素（0から始まる）を含むコレクションを返します。

注釈：索引番号が範囲外の場合、null を返します。
namedItem(id)

指定された id の <tr> 元素を含むコレクションを返します。

注釈：id が存在しない場合、null を返します。

技術的詳細

DOM バージョン： Core Level 2 Document Object
返り値：

HTMLCollection オブジェクト、<table> 元素内のすべての <tr> 元素を表します。

コレクション内の要素はソースコード内での出現順序に従って並べ替えられます。

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート

HTML DOM Table オブジェクト