Как найти все элементы с определённым классом и сложить их содержимое?

Question

[MegaPuxapb]

Как вытащить и сложить цену, у всех .price?

<div class="wrap">
      <div class="price">2 руб.</div>
      <div class="price">3 руб.</div>
      <div class="price">4 руб.</div>
</div>

Answer 1

[0xD34F]

Кого надо сложить: const className = 'price';.

Как получить элементы:

const elements = document.querySelectorAll(`.${className}`);
// или
const elements = document.getElementsByClassName(className);

Как из элемента извлечь значение:

const getVal = el => parseFloat(n.textContent);
// или
const getVal = el => Number(el.innerText.split(' ')[0]);
// или
const getVal = el => +el.innerHTML.match(/\d+(\.\d+)?/)[0];

Извлекаем, складываем:

const sum = Array.prototype.reduce.call(
  elements,
  (acc, n) => acc + getVal(n),
  0
);

// или

let sum = 0;
for (const n of elements) {
  sum += getVal(n);
}

// или

let sum = 0;
for (let i = 0; i < elements.length; i++) {
  sum += getVal(elements[i]);
}

// или

const sum = eval(Array.from(elements, getVal).join('+')) || 0;

// или

const sum = (function get(i, n = elements.item(i)) {
  return n ? getVal(n) + get(i + 1) : 0;
})(0);

Answer 2

[MegaPuxapb]

решил вот так:

function totalSumma() {
		var sum = 0;
		$('.price').each(function(){
		    sum += parseFloat($(this).text());
		});
	}