如果我有一个 HTML 表格...说
<div id="myTabDiv">
<table name="mytab" id="mytab1">
<tr>
<td>col1 Val1</td>
<td>col2 Val2</td>
</tr>
<tr>
<td>col1 Val3</td>
<td>col2 Val4</td>
</tr>
</table>
</div>
我将如何遍历所有表行（假设每次检查时行数都可能发生变化）并从 JavaScript 中的每一行中的每个单元格中检索值？
如果你想遍历每一行（<tr>），知道/识别行（<tr>），并遍历每一行（<td>）的每一列（<tr>），那么这就是要走的路。
var table = document.getElementById("mytab1");
for (var i = 0, row; row = table.rows[i]; i++) {
//iterate through rows
//rows would be accessed using the "row" variable assigned in the for loop
for (var j = 0, col; col = row.cells[j]; j++) {
//iterate through columns
//columns would be accessed using the "col" variable assigned in the for loop
}
}
如果您只想通过单元格（<td>），而忽略您所在的行，那么这就是要走的路。
var table = document.getElementById("mytab1");
for (var i = 0, cell; cell = table.cells[i]; i++) {
//iterate through cells
//cells would be accessed using the "cell" variable assigned in the for loop
}
你可以考虑使用jQuery。使用 jQuery 非常简单，可能看起来像这样：
$('#mytab1 tr').each(function(){
$(this).find('td').each(function(){
//do your stuff, you can use $(this) to get current cell
})
})
尝试
for (let row of mytab1.rows)
{
for(let cell of row.cells)
{
let val = cell.innerText; // your code below
}
}
var table=document.getElementById("mytab1");
var r=0; //start counting rows in table
while(row=table.rows[r++])
{
var c=0; //start counting columns in row
while(cell=row.cells[c++])
{
cell.innerHTML='[R'+r+'C'+c+']'; // do sth with cell
}
}<table id="mytab1">
<tr>
<td>A1</td><td>A2</td><td>A3</td>
</tr>
<tr>
<td>B1</td><td>B2</td><td>B3</td>
</tr>
<tr>
<td>C1</td><td>C2</td><td>C3</td>
</tr>
</table>在每次通过 while 循环 r/c 迭代器增加时，集合中的新行/单元格对象被分配给行/单元格变量。当集合中没有更多行/单元格时，将 false 分配给行/单元格变量并在循环停止（退出）时进行迭代。
更好的解决方案：使用 Javascript 的原生Array.from()并将 HTMLCollection 对象转换为数组，之后您可以使用标准数组函数。
var t = document.getElementById('mytab1');
if(t) {
Array.from(t.rows).forEach((tr, row_ind) => {
Array.from(tr.cells).forEach((cell, col_ind) => {
console.log('Value at row/col [' + row_ind + ',' + col_ind + '] = ' + cell.textContent);
});
});
}
您也可以参考tr.rowIndexandcell.colIndex而不是使用row_indand col_ind。
与前 2 个最高投票答案相比，我更喜欢这种方法，因为它不会使您的代码与全局变量i、j、row和col混淆，因此它提供了干净的module化代码，不会产生任何副作用（或引发 lint / 编译器警告） ...没有其他库（例如jquery）。
如果您需要它在旧版本（ES2015 之前）的 Javascript 中运行，则Array.from可以使用 polyfill。