Как сложить значения с одинаковым классом js?

Question

Как сложить значения с одинаковым классом js?

Рейтинг: -2Ответов: 1Опубликовано: 13.05.2023

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

const kmSum = document.querySelector('right-form-calculator__cost.km').innerText;
        const sumService = document.querySelector('.right-form-calculator__cost.service').innerText;
        const mainSum = document.querySelector('.right-form-calculator__sum');

        const total = kmSum + sumService;
        mainSum.innerHTML = total;

.right-form-calculator__row{
  margin: 0px 0px 20px 0px;
}

.right-form-calculator__sum{
  color:red;
}

<div class="right-form-calculator__column">
  <div class="right-form-calculator__cost km">1600</div>
</div>

<div class="right-form-calculator__row">
  <div class="right-form-calculator__cost service">750</div>
  <div class="right-form-calculator__cost service">1050</div>
  <div class="right-form-calculator__cost service">1100</div>
  <div class="right-form-calculator__cost service">1700</div>
</div>

<div class="right-form-calculator__sum">
  Сумма 3850
  <span>руб</span>
</div>

javascript

Источник: Stack Overflow на русском

Answer 1

▲ 1

По вашему примеру кода я понимаю нечто такое) помогло?

        const summ = document.getElementById("summ")
        const ststSum = parseInt(document.querySelector(".km").innerHTML)
        const services = document.querySelectorAll(".service")
        function calcPlus() {
            let calc = 0
            services.forEach(el => {
                calc+= parseInt(el.innerHTML)
            })
            console.log(calc + ststSum)
            summ.innerHTML = calc + ststSum
        }
        calcPlus()

        .right-form-calculator__row{
        margin: 0px 0px 20px 0px;
        }

        .right-form-calculator__sum{
        color:red;
        }

    <div class="right-form-calculator__column">
        <div class="right-form-calculator__cost km">1600</div>
      </div>
      
      <div class="right-form-calculator__row">
        <div class="right-form-calculator__cost service">750</div>
        <div class="right-form-calculator__cost service">1050</div>
        <div class="right-form-calculator__cost service">1100</div>
        <div class="right-form-calculator__cost service">1700</div>
      </div>
      
      <div class="right-form-calculator__sum">
        Сумма <p id="summ">3850</p>
        <span>руб</span>
      </div>

Как сложить значения с одинаковым классом js?

Ответы