Получить значение нескольких DOM элементов JS

Рейтинг: 0Ответов: 2Опубликовано: 26.02.2015

Есть сформированный html, структуру которого я не могу менять, по типу:

<div class="parent-block">
    <div class="item-wrap">
        <span class="item-val">10</span>
    </div>
    <div class="item-wrap">
        <span class="item-val">20</span>
    </div>
    <div class="item-wrap">
        <span class="item-val">20</span>
    </div>
</div>

Мне необходимо получить с помощью js числа, которые находятся в спанах, суммировать их и результат присвоить переменной.

Для получения содержимого одного элемента я использовал такой код:

var getval = (($(".item-wrap").children(".item-val")).text());

Для получения данных из нескольких элементов, я так понимаю, надо использовать цикл, только я этого не умею, или, может, есть какой-то другой вариант?

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

Ответы

▲ 2

http://jsfiddle.net/rh43591h/

var sum = 0;

$(".item-val").each(function() {
    sum += +$(this).text();
});

alert(sum);

UPD:

Поюзал метод map, на который указал @RubaXa, и получился адски извращенный, но рабочий код.

http://jsfiddle.net/rh43591h/1/

alert(
    eval(
        $( ".item-val" ).map(function() {
            return $(this).text();
        })
        .get()
        .join('+')
    )
);
▲ 1

Как-то так:

var getVal = 0;
$('.item-val').each(function(i, e){
  getVal += parseInt(e.text());
});

P. S. Не успел :)