如果我有一个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?
当前回答
使用一个for循环:
var table = document.getElementById('tableID');
var count = table.rows.length;
for(var i=0; i<count; i++) {
console.log(table.rows[i]);
}
其他回答
如果你想要一个函数式的样式，像这样:
const table = document.getElementById("mytab1");
const cells = table.rows.toArray()
.flatMap(row => row.cells.toArray())
.map(cell => cell.innerHTML); //["col1 Val1", "col2 Val2", "col1 Val3", "col2 Val4"]
你可以修改HTMLCollection的原型对象(允许以类似于c#中的扩展方法的方式使用)，并嵌入一个将集合转换为数组的函数，允许使用具有上述风格的高阶函数(类似于c#中的linq风格):
Object.defineProperty(HTMLCollection.prototype, "toArray", {
value: function toArray() {
return Array.prototype.slice.call(this, 0);
},
writable: true,
configurable: true
});
Try
for (let row of mytab1.rows)
{
for(let cell of row.cells)
{
let val = cell.innerText; // your code below
}
}
for （let row of mytab1.rows） { for（let cell of row.cells） { console.log（cell.innerText） } } <div id=“myTabDiv”> <表名=“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>
(《让我排》[let[我]排][.. mytab1]。 { 用于(let [j,cell] [.. row.cells].entries() { 控制台(“[$ [$]，$ [j]]] = ${cell.innerText}”) 的 的 < div id = " myTabDiv > <table . the 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 >
我的解决方案，使用es6:
var table = document.getElementById('mytab1');
var data = [...table.rows].map(row => [...row.cells].map(td => td.innerText));
console.log(data)
引用: https://developer.mozilla.org/pt-BR/docs/Web/API/HTMLCollection
这个解决方案对我来说非常有效
var table = document.getElementById("myTable").rows;
var y;
for(i = 0; i < # of rows; i++)
{ for(j = 0; j < # of columns; j++)
{
y = table[i].cells;
//do something with cells in a row
y[j].innerHTML = "";
}
}
es6:
const table = document.getElementById('some-table');
const cells = table.getElementsByTagName('td');
for (let cell of cells) {
// do something with cell here
}
早期版本:
var table = document.getElementById('some-table');
var cells = table.getElementsByTagName('td');
for ( var i in cells ) {
// do something with cells[i]
}
来源:https://developer.mozilla.org/en-US/docs/Web/API/Element/getElementsByTagName
