10

シーケンシャル要素にアクセスする方法があることは知っていますが、インデックスでアクセスする方法がわかりません。それを行う方法はありますか？

私は次のようなものを探しています:

document.getElementById('table1').cell[1]
4

5 に答える 5

23

行インデックスとその行内のセル インデックスでセルにアクセスするには、次を使用できます。

var rowIndex = 0;
var cellIndex = 1;
document.getElementById('table1').rows[rowIndex].cells[cellIndex];

これは、最初の行 (インデックス 0) の 2 番目のセル (インデックス 1) にアクセスします。

セル インデックスを使用するだけで (行を追跡しないで)、各行のセルを反復処理する場合は、これを行うことができますが、すべての行に同じ数のセルがある場合に限ります。次のコードは、テーブルの 4 番目のセル (インデックス 3) にアクセスし、それが行 0、1、または 3 にあるかどうかに関係なくアクセスします。各行のセル数が同じである限り:

var cellIndex = 3;
var table = document.getElementById('table1');
var num_columns = table.rows[0].cells.length;
var cell = table.rows[Math.floor(cellIndex/num_columns)].cells[cellIndex % num_columns];
于 2012-06-07T22:29:17.307 に答える
6

テーブルの.rowsコレクションは、行へのアクセスを提供します。行の.cellsコレクションは、その行のセルへのアクセスを提供します。どちらもゼロベースのインデックスを使用し、.lengthプロパティを持っています。そう：

var table = document.getElementById('table1');

alert(table.rows.length);                // number of rows
alert(table.rows[2].cells.length);       // number of cells in row 3

alert(table.rows[2].cells[5].innerHTML); // contents of 6th cell in 3rd row
于 2012-06-07T22:38:17.913 に答える
3

IDによるクエリを要素のツリーに制限するには、次を使用できますquerySelector。

document.getElementById('table1').querySelector('#cell1');

しかし、単純にできる場合、それは冗長です

document.getElementById('cell1');

編集: OP の要求によりよく答えるために、次の方法でテーブルのセルに順番にアクセスできます。

document.getElementById('table1').tBodies[i].rows[j].cells[k];

これにより、表の - 番目の本体の -番目の行の -k番目のセルが選択されます。テーブルに(通常のように) 要素が 1 つしかない場合、または から独立してセルにアクセスしたい場合は、その部分を省略できます。ji<tbody><tbody>.tBodies[i]

于 2012-06-07T22:30:47.023 に答える
3 
document.querySelector('table td'); //Done. IE8 and above supported.
                                    //Only the first one will be selected.

　

document.querySelector('#table1 td'); //First cell in #table1

document.querySelector('#table1 td:nth-child(3)'); //Third cell in #table1
document.querySelectorAll('#table1 td')[2];        //or this
于 2012-06-07T22:33:22.103 に答える
1

<td>セルに IDを与えます。

<td id="mycell">

次に、次を使用して DOM オブジェクトにアクセスできますgetElementById()。

document.getElementById('mycell');
于 2012-06-07T22:31:36.113 に答える