如何使用id与array对td标签中的数字求和

Question

我试图得到td标签内的数字和标签有id=total[]作为一个数组。示例:

<td id="total[1]">200<td>
<td id="total[2]">400<td>
<td id="total[3]">500<td>
...etc

如何使用id得到它们的和?

Answer 1

HTML的Jquery示例

$(document).ready(function(){
var Sum = 0;
$("[id*=total]").each(function(){
Sum += parseFloat($(this).text());
});
$("#ttl").text(Sum);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<td id="total[1]">200<td>
<td id="total[2]">400<td>
<td id="total[3]">500<td>
</table>
Total: <span id="ttl"></span>

Answer 2

如果没有特别的原因需要使用id，那么最好使用class。

例如:

<td class="foo">200<td>
<td class="foo">400<td>
<td class="foo">500<td>
...etc

然后可以通过循环遍历元素来添加值:

var items = document.getElementsByClassName("foo");
var sum = 0;
for (var i = 0; i < items.length; i++) {
sum += parseFloat(items.item(i).innerHTML);
}