0

У меня есть Html страница и на ней размещена таблица.

var t = document.getElementById('table');
var tra = t.getElementsByTagName('tbody'); // Здесь выскакивает ошибка
var trs = tra.getElementsByTagName('tr');
var tds = null;
var sum;

for (var i = 0; i < trs.length; i++) {
  tds = trs[i].getElementsByTagName('td');
  for (var n = 0; n < trs.length; n++) {
    sum += "array[]=" + tds[n]
    if (i != trs.length - 1) {
      sum += "&"
    }
  }
}

console.log(sum);
<div tag="table_div">
  <table border="1" id="table">
    <tbody>
      <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
      </tr>
      <tr>...</tr>/и так далее
      <tbody>
  </table>
</div>

Он не работает. В чём проблема? Или как мне правильно пройтись по всем элементам таблицы?

1

2 ответа 2

3

var t = document.getElementById('table');
var tra = t.children;
var trs = tra[0].children;
var tds = null;
var sum = 0;

for (var i=0; i<trs.length; i++)  {
    tds = trs[i].children;
    for (var n=0; n<tds.length;n++)  {
        sum += parseInt(tds[n].innerText);
    }
}
console.log(sum);
<div tag="table_div">
    <table border="1" id="table">
        <tbody>
            <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
            <td>1</td>
            </tr>
            <tr>...</tr>/и так далее
        <tbody>
    </table>
</div>

3
  • Большое спасибо за ответ! Но у меня возникла новая проблема. Дело в том что я создаю таблицу с помощью php скрипта. И Js наотрез отказывается видеть <tbody>. Что с этим можно сделать? Пишет Uncaught TypeError: Cannot read property 'children' of undefined 14 мая 2020 в 20:33
  • переменная из которой вы пытаетесь получить список дочерних элементов не присвоилось значения, смотрите выше ошибку в той строке где этой переменной присваиваете значение используйте console.log() где нужно посмотреть результат функции
    – IvaMuxa
    15 мая 2020 в 17:03
  • В том то и дело, что я первым делом посмотрел что мне выводит console.log саму <table> которая динамически создается JS прекрасно находит а именно <tbody> найти не может. 15 мая 2020 в 20:04
1

var sum = "";
document.querySelectorAll("#table tr").forEach(tr => {
  var cells = [];
  tr.querySelectorAll("td").forEach(td => cells.push(td.textContent));
  sum += "row=" + cells.join("&");
});

console.log(sum);
<div tag="table_div">
  <table border="1" id="table">
    <tbody>
      <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
      </tr>
      <tr>...</tr>/и так далее
      <tbody>
  </table>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.