循环并选择DOM中的每个元素？

-4

<p class="item" data-price="2" data-qty="1">item 1</p> 
<p class="item" data-price="12" data-qty="4">item 2</p> 
<p class="item" data-price="4" data-qty="2">item 3</p>

如何使用循环来总结上述项目的价格和数量？我知道如何在数量上获得价值，但如何循环它们呢？使用jQuery.each循环并选择DOM中的每个元素？

parseInt($('.item').attr('data-price')) * $('.item').attr('data-qty')

来源

2015-07-13 Lee shienlong

哪里是你的代码？ –

@RichardKho我被困在循环部分。 –

使用'jQuery.prototype.each'方法。 – undefined

迭代并总和

var sum = 0; 
 
$(".item").each(function(){ 
 
    sum += this.dataset.price * this.dataset.qty; 
 
}); 
 

 
$("h2").html("Result: " + sum);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p data-price="2" data-qty="1" class="item">item 1</p> 
 
<p data-price="12" data-qty="4" class="item">item 2</p> 
 
<p data-price="4" data-qty="2" class="item">item 3</p> 
 

 

 
<h2> </h2>

来源

2015-07-13 01:41:32 Anoop

编辑完成后，结果返回错误。他在编辑 –

@TamilSelvan修正中错过了p = tag中的class =“item”.. – Anoop

这里是调用HTML 5的数据属性的正确方法。来源：How to select the HTML5 data attribute in jQuery?

var sum = 0; 
$("p.item").each(function(i){ 
    var items = "p.item:eq(" + i + ")"; 
    sum += parseInt($(items).data("price"), 10) * parseInt($(items).data("qty"), 10); 
}); 

$("h3").text(sum);

DEMO

来源

2015-07-14 03:38:32

循环并选择DOM中的每个元素？

回答

相关问题