jquery更新第n个元素后的所有元素？

Question

比方说，我有以下代码：

<ul> 
    <li data-val="1">1</li> 
    <li data-val="4">2</li> 
    <li data-val="2">3</li> 
    <li data-val="5">4</li> 
    <li data-val="1">5</li> 
</ul> 

我想是ul li:gt(0)有innerHTML与data-val + innerHTML总和的所有项目。所以，结果我要的是：

<ul> 
    <li data-val="1">1</li> 
    <li data-val="4">6</li> 
    <li data-val="2">5</li> 
    <li data-val="5">9</li> 
    <li data-val="1">6</li> 
</ul> 

我可以用一个循环做到这一点，但不知道这是最好的方式在性能方面和微创冗长的代码方面。有没有更好的办法？

我可以使用jQuery和CSS。

Answer 1

你可以叫.html()，并通过该总结的两个字段的功能：

$('ul li:gt(0)').html(function() {   
    return $(this).data('val') + parseInt($(this).html()); 
});​ 

http://jsfiddle.net/infernalbadger/VJAza/