This question has already been answered:

There is a table with some values. How using pure js table values ​​to output into an array of objects? To get something like arr = [{name: Vasya, age: 10}, {}]

<table id="grid"> <thead> <tr> <th data-type="number">Возраст</th> <th data-type="string">Имя</th> </tr> </thead> <tbody> <tr> <td>5</td> <td>Вася</td> </tr> <tr> <td>2</td> <td>Петя</td> </tr> <tr> <td>12</td> <td>Женя</td> </tr> <tr> <td>9</td> <td>Маша</td> </tr> <tr> <td>1</td> <td>Илья</td> </tr> </tbody> </table>

Reported as a duplicate at Grundy. javascript Aug 18 '18 at 13:27 .

A similar question was asked earlier and an answer has already been received. If the answers provided are not exhaustive, please ask a new question .

  • one
    How is the field name and value matched? why name and age ? - Grundy
  • I do not quite understand your question. Because in one column there are names, and in another age. - Anna That
  • one
    Why should the name be Vasya instead of 5? Why is the key name called at all? - Grundy
  • Um, I don't think I understand something. I just took it out of my head. I do not understand how important is the name of the key? I have a contact table with a name and age. Those. I need an object from each row of the table, which will include two key-values ​​- a name and an age. Maybe I do not quite do what you want? I just want to add sorting to the table, but first, it seems that the value of the table should be written to the array ... - Anna That

1 answer 1

 let tableElements = document.querySelectorAll("tbody > tr"), arrayWithData = []; Array.from(tableElements, e => { let childNodes = e.getElementsByTagName("td"); arrayWithData.push({ age: +childNodes[0].textContent, name: childNodes[1].textContent }); }); console.log(arrayWithData); 
 <table id="grid"> <thead> <tr> <th data-type="number">Возраст</th> <th data-type="string">Имя</th> </tr> </thead> <tbody> <tr> <td>5</td> <td>Вася</td> </tr> <tr> <td>2</td> <td>Петя</td> </tr> <tr> <td>12</td> <td>Женя</td> </tr> <tr> <td>9</td> <td>Маша</td> </tr> <tr> <td>1</td> <td>Илья</td> </tr> </tbody> </table>