Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to access second cell of each row in a html table using javascript?

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.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

 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>

>Solution :

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>

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.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading