Como somar td de uma tabela em js puro

TOTVS Fluig Documentos (ECM)
, , ,
1

Sou novo como Dev e gostaria de uma ajuda para conseguir realizar o somatório dos valores das td's que são adicionadas a minha planilha. realializei alguns testes, mas até o momento dessa postagem, não consegui resolver meu problema. Obs: Os valores são inseridos através de um input.

Abaixo segue uma parte do código. As duas primeiras adicionam uma tr a minha página com o tipo de transação da mercadoria (compra ou venda), o nome da mercadoria e o valor da mercadoria.

No caso, quero somar e subtrair só os valores para que o resultado seja alterado no valor total. Se for compra, será subtração do valor, se for venda, será adição do valor.


desenhaTabela()
function desenhaTabela () {
  for (transaction of objStorage) {
    document.querySelector('.tabelaGeral').innerHTML += `
  <tr>

    <td class="produto">${transaction.tipo}&nbsp;${transaction.nome}</td> 

    <td class="preco">${transaction.valor}</td>
  </tr>`
  };


}



function lerTabela () {
// Dom nome e valor dos input
var tabela = document.querySelector('.tabelaGeral')
let nome = document.querySelector('.btnMercadoria')
let nomeMercadoria = nome.value
let currency = document.querySelector('.btnValor')
let valor = currency.value
let tipoSelecao = document.getElementsByName('trade')


tabela.innerHTML += `
  <tr>

    <td class="produto">${tipoSelecao.value == "compra" ? "+" : "-" }&nbsp;${nomeMercadoria}</td> 

    <td class="preco">${valor}</td>
  </tr>`

  objStorage.push({
    nome: nomeMercadoria,
    valor: valor,
    tipo: tipoSelecao.value == "compra" ? "+" : "-"
  })

  localStorage.setItem('objStorage', JSON.stringify(objStorage))

};



function totaValor () {

  var linha = document.getElementsByClassName(".preco");
  var resultado = document.getElementsByClassName('.qtdTotal').innerHTML = 0;


     for (i = 0; i < linha.length; i++) {
         resultado = resultado + Number(linha[i].innerHTML);
     }

 document.getElementsByClassName(".qtdTotal").innerHTML = resultado;


    document.querySelector('.tabelaGeral .foot').innerHTML += `
  <tr>

    <td>Total</td> 

    <td class="qtdTotal">${resultado}</td>
  </tr>`

  if (objStorage.length > 0) {
    document.querySelector('.tabelaGeral tfoot').innerHTML += `
    <tr>
      <td></td>
      <td class="status">${Math.sign(resultado) > 0 ? "[LUCRO]" : "[PREJUÍZO]"}</td>
    </tr>`
  }

  console.log(resultado)
}
totaValor()
2 

resultado = resultado + Number(linha[i].innerHTML);

Cuidado ao simplesmente converter o conteúdo em número, pois JS reconhece decimais com . enquanto somos acostumados a usar ,

Ideal é primeiro formatar a string pra corresponder a um número no formato americano e só então converter pra Number.


resultado = resultado + Number(linha[i].innerHTML.replaceAll('.', '').replace(',', '.'));

E o que você está obtendo de errado? Tem mensagem de erro? O valor está incorreto?

Fiquei curioso com o motivo de usar localStorage :)