和 - jQueryの

Question

私は以前の各liから値を追加し、現在のli値以下の合計を表示しようとしているが

これは、HTML

<ul> 
    <li>+2</li> 
    <div id="sum" >Sum:</div> 
    <li>+2</li> 
    <div id="sum" >Sum:</div> 
    <li>-1</li> 
    <div id="sum" >Sum:</div> 
    <li>-1</li> 
    <div id="sum" >Sum:</div>      
</ul> 

は何ですか私が探しているものは次のようなものです：

+2 
sum: 2 

+2 
sum: 4 

-1 
sum: 3 

-1 
sum: 2 

それぞれの値は動的に生成されます。だから、私がjQueryで探しているのは、「以前のそれぞれのliの値を見つけ、ここの合計を与える」のようなものです。

Answer 1

li

内divを移動

そして、あなたはdiv

$(this).clone().find('div').remove().end().text().trim()このような

var count = 0; 
 
$("ul li").each(function() { 
 
    var number = $(this).clone().find('div').remove().end().text().trim(); 
 
    count += parseInt(number); 
 
    $(this).find("div").text("sum: " + count) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>+2 
 
    <div class="sum">Sum:</div> 
 
    </li> 
 
    <li>+2 
 
    <div class="sum">Sum:</div> 
 
    </li> 
 
    <li>-1 
 
    <div class="sum">Sum:</div> 
 
    </li> 
 
    <li>-1 
 
    <div class="sum">Sum:</div> 
 
    </li> 
 
</ul>

を "削除" で liに番号を取得することができ、各 li

をループしてみ

Answer 2

var ulChildren = $('ul >'); 
 
var result = 0; 
 
for (var i = 0; i < ulChildren.length; i++) { 
 
    var child = ulChildren[i]; 
 
    if (child.nodeName === 'LI') { 
 
    result += parseInt(child.innerHTML); 
 
    continue; 
 
    } 
 
    if (child.id === 'sum') { 
 
    child.innerHTML += result; 
 
    } 
 
} 
 
console.log(result);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<ul> 
 

 
    <li>+2</li> 
 

 
    <div id="sum">Sum:</div> 
 

 
    <li>+2</li> 
 

 
    <div id="sum">Sum:</div> 
 

 
    <li>-1</li> 
 

 
    <div id="sum">Sum:</div> 
 

 
    <li>-1</li> 
 

 
    <div id="sum">Sum:</div> 
 
</ul>