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);
})