javascript - div 内的数字相加

Question

是否可以将 div 中的数字相加？基本上我想将商品放入购物车，将商品放入购物车后，我想将商品的所有价格相加以获得最终价格。我的一段代码:

   <div class="div" id="contentTri29">
        <p>Naziv proizvoda: Angel eyes white</p>
        <p>Sifra proizvoda: <a href="#" class="item">001.29</a></p>
        <p>Cijena proizvoda: <div class="price">690</div></p>
        <div>
            <p><img src="~/images/farovi/angel_eyes_white.jpg" /></p>
        </div>
    </div>

    <div class="div" id="contentTri30">
        <p>Naziv proizvoda: Angel eyes smoked</p>
        <p>Sifra proizvoda: <a href="#" class="item">001.30</a></p>
        <p>Cijena proizvoda: <div class="price">690</div></p>
        <div>
            <p><img src="~/images/farovi/angel_eyes_smoked.jpg" /></p>
        </div>
    </div>
</div>

是否可以以某种方式将选定的 div 与 div id“价格”连接？

Answer 1

这是一个可能的解决方案:

var total = 0;

$('#add').on('click', function(){
  
  var priceList = $('.price');
  
  $.each(priceList, function(i, price){
    total+= parseFloat($(price).text());
   });
  
 $('#total').text("Total is: "+ total);
  
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
   <div class="div" id="contentTri29">
        <p>Naziv proizvoda: Angel eyes white</p>
        <p>Sifra proizvoda: <a href="#" class="item">001.29</a></p>
        <p>Cijena proizvoda: <div class="price">690kn</div></p>
        <div>
            <p><img src="~/images/farovi/angel_eyes_white.jpg" /></p>
        </div>
    </div>

    <div class="div" id="contentTri30">
        <p>Naziv proizvoda: Angel eyes smoked</p>
        <p>Sifra proizvoda: <a href="#" class="item">001.30</a></p>
        <p>Cijena proizvoda: <div class="price">690kn</div></p>
        <div>
            <p><img src="~/images/farovi/angel_eyes_smoked.jpg" /></p>
        </div>
    </div>
</div>
<br/>
<div id="total"></div>
     
     <br/>
     <button id="add">Sum</button>