I was trying to access every second cell of each row in a table, but it doesn't seem to be working and just shows a bunch of undefined variables. Is there any way that I can do this? Any help would be appreciated.
Example table :
Column A | Column B | Column C |
---|---|---|
Data 1A | Data 1B | Data 1C |
Data 2A | Data 2B | Data 2C |
Data 3A | Data 3B | Data 3C |
Note : I was trying to access the italic data cell.
let table = document.querySelector("table");
for (let row of table.rows) {
for (let cell of row.cells) {
console.log(cell[1]);
}
}
Output :
Undefined
Expecting output :
<td>Data 1B</td>
<td>Data 2B</td>
<td>Data 3B</td>
CodePudding user response:
Please see:
const tbl = document.querySelector("table");
for(let row of tbl.rows) {
console.log(row.cells[1].innerHTML);
}
<table>
<tbody>
<tr>
<td>td 0.0</td>
<td>td 0.1</td>
<td>td 0.2</td>
</tr>
<tr>
<td>td 1.0</td>
<td>td 1.1</td>
<td>td 1.2</td>
</tr>
</tbody>
</table>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>
In your code you are trying to reach the index of inner value of the iterated cell as:
for (let cell of row.cells) {
console.log(cell[1]);
}
which is incorrect.
CodePudding user response:
This is my solution:
let secCellList= document.querySelectorAll("table tbody tr td:nth-child(2)");
secCellList.forEach(secondCell=>{
console.log(secondCell.innerHTML);
})