считывание таблички html в двумерный массив

Question

Знакомлюсь с js! У меня есть табличка, в которую пользователь вводит данные. Мне нужно ее обработать , а для этого необходимо получить двумерный массив вида [[a00 ,a01 ,a02], [a10,....]..]. Подскажите, есть ли умный способ это сделать? Потому что считывать поэлементно, а потом вставлять в массив кажется не лучшей идеей

<div class = "table_in">
    <p> Matrix A: </p>
    <table id = "matA">
    <tbody>
        <tr>

        <td> <input type="text" name="a00"> </td>
        <td> <input type="text" name="a01"> </td>
        <td> <input type="text" name="a02"> </td>
        </tr>
        <tr>
        <td> <input type="text" name="a10"> </td>
        <td> <input type="text" name="a11"> </td>
        <td> <input type="text" name="a12"> </td>
        </tr>
        <tr>
        <td> <input type="text" name="a20"> </td>
        <td> <input type="text" name="a21"> </td>
        <td> <input type="text" name="a22"> </td>
        </tr>
    </tbody>
        </table>

Спасибо!

Answer 1

Можно при помощи Array.from(), HTMLTableElement.rows и HTMLTableRowElement.cells:

const array = Array.from(
  document.querySelector('table').rows,
  row => Array.from(
    row.cells,
    cell => cell.querySelector('input').name
  ),
);

console.log(array);

<table id = "matA">
    <tbody>
        <tr>
        <td> <input type="text" name="a00"> </td>
        <td> <input type="text" name="a01"> </td>
        <td> <input type="text" name="a02"> </td>
        </tr>
        <tr>
        <td> <input type="text" name="a10"> </td>
        <td> <input type="text" name="a11"> </td>
        <td> <input type="text" name="a12"> </td>
        </tr>
        <tr>
        <td> <input type="text" name="a20"> </td>
        <td> <input type="text" name="a21"> </td>
        <td> <input type="text" name="a22"> </td>
        </tr>
    </tbody>
</table>

БЛОГ НА HUSL

считывание таблички html в двумерный массив

Ответы (1 шт):