2

以下に示すように、getElementsByTagName メソッドを使用して JavaScript でテーブル セルにアクセスしようとしています。最終的に、配列内の各セルを別の値と比較し、比較に従ってそのセルの背景色を変更できるようにしたいと考えています。

var cells = document.getElementById("myTable").getElementsByTagName("tr");
for (i = 0; i < cells.length; i++)
{
   cells[i] = cells[i].getElementsByTagName("td");
}

ただし、cells[0][0] にアクセスしようとすると、undefined が返されます。getElementsByTagName が行っていることを完全には理解していないように感じます...このメソッドに希望はありますか? より効率的なものはありますか？

4

4 に答える 4

1

.rowstable 要素のプロパティと tr 要素の.cellsプロパティを使用して、任意のセルに直接アクセスできます。

var myCell = myTable.rows[y].cells[x];

独自のアレイを構築する必要はありません。

.getElementsByTagName()したがって、1 次元配列を返す は使用しないでください。(まあ、実際には NodeList ですが、 liveであることを覚えている限り、配列のように使用できます。)

すべてのセルをループして他の値と比較したい場合は、 and を使用して、左から右、上から下の方法を次に示し.rowsます.cells。

var rows = document.getElementById("myTable").rows;
for (var y=0; y < rows.length; y++) {
   for (var x=0; x < rows[y].length; x++) {
      var cellAtXY = rows[y].cells[x];
      cellAtXY.someProperty = something; // your code here
   }
}
于 2011-11-10T07:16:02.563 に答える
1

jqueryを使用すると簡単になります：

var contentArray = new Array();



$('tr').each(function(indexParent) {
  contentArray['row'+indexParent] = new Array();
    $(this).children().each(function(indexChild) {
      contentArray['row'+indexParent]['col'+indexChild] = $(this).html();
    });
});
于 2011-11-10T07:00:08.023 に答える
0

行ごとにこのようなことをする必要があります。

var row = table.getElementsByTagName('tr')[rowIndex];
var cells = row.getElementsByTagName('td');

次に、これらの変数の内容から配列を構築します。

于 2011-11-10T07:03:00.550 に答える
0

これを使用して、表のセルを 2D 配列として取得します

var tableRows = (document.getElementById("myTable")).getElementsByTagName("tr");

var cells = [];
for(var i = 0; i < tableRows.length; i++) {
    cells.push(tableRows[i].getElementsByTagName("td"));
}

これで、テーブルの任意のセルを取得できます

cells[0][0]
于 2011-11-10T07:08:44.710 に答える