Вычислить две суммы из столбца, который имеет два класса

Question

Из таблицы мне нужно сложить значение из одного столбца.но у них будет или А или В в качестве своего класса.Я хочу, чтобы сумма A и сумма B.

Класс / Значение

A / 3

B / 2

B / 7

A / 1

==> Сумма: 4 / Сумма B: 9

Также, когда я удаляю строку, сумма также должна быть изменена.(Не уверен, что он будет автоматически пересчитываться при удалении его из другого кода)

Я рассматривал вопрос о том, чтобы поместить условие if-else в цикл для разделения классов, но не смог разобраться.

Answer 1

Используйте reduce после преобразования querySelectorAll в массив:

let A = [...document.querySelectorAll("table .A")].reduce((acc, curr) => acc + +curr.innerText, 0);
let B = [...document.querySelectorAll("table .B")].reduce((acc, curr) => acc + +curr.innerText, 0);
console.log(A);
console.log(B);

<table border="1">
  <td class="A">3</td>
  <td class="B">2</td>
  <td class="B">7</td>
  <td class="A">1</td>
</table>