这个方法的优点是待统计的对象和存结果的对象可以在页面的任意位置,只要具有相同的自定义组号就行。
将要统计的所有对象都加上自定义属性"待统计组",并给它个自定义编号
<td 待统计组="1">111</td>
<p 待统计组="1">222</p>
将要保存结果的所有对象加上自定义属性"汇总组",并给它个编号。则这个对象会统计所有含自定义属性 待统计组="1" 的对象的text的和。
<td 汇总组="1">这里是求和结果会被替换成333</td>
<p 汇总组="1">这里是求和结果会被替换成333</p>
<h3>将这段代码保存成html文件打开看看</h3>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.5.1/jquery.min.js"></script>
<table border="1">
<thead>
<tr>
<td>行号</td>
<td>有自定义属性 统计组=1的格子</td>
<td>有自定义属性 统计组=2的格子</td>
<td>有自定义属性 统计组=3的格子</td>
</tr>
</thead>
<tr>
<td>1</td>
<td 待统计组="1">111</td>
<td 待统计组="2">222</td>
<td 待统计组="3">333</td>
</tr>
<tr>
<td>2</td>
<td 待统计组="1">111</td>
<td 待统计组="2">222</td>
<td 待统计组="3">333</td>
</tr>
<tfoot>
<tr>
<td>汇总行</td>
<td 汇总组="1">这里是求和结果会被替换成222</td>
<td 汇总组="2">这里是求和结果会被替换成444</td>
<td 汇总组="3">这里是求和结果会被替换成1666(后面有1个p也存了1000)</td>
</tr>
</tfoot>
</table>
即便放在p里面也可以统计
<p 待统计组="3">1000</p>
<script>
$(document).ready(function() {
$("[汇总组]").each(function() {
var 汇总组号 = $(this).attr('汇总组');
var 汇总组号_sum = 0;
$("[待统计组='" + 汇总组号 + "']").each(function() {
var this_float = parseFloat($(this).text());
if (!isNaN(this_float)) {
汇总组号_sum += this_float;
}
});
console.log("组号=" + 汇总组号 + ', 和=' + 汇总组号_sum);
$(this).text(汇总组号_sum);
})
});
</script>
