javascript - jQuery 过滤器选择前两个，然后选择下两个

Question

我有以下列表:

<li class="list one" data-number="2"></li>
<li class="list one" data-number="2"></li>
<li class="list two" data-number="3"></li>
<li class="list two" data-number="7"></li>

我需要将每个值从 data-number 属性传递给基于列表类的变量。

我有这些功能:

var list_one = 0;
var list_two = 0;

$(".one").each(function (i, val) {
  var number = $(this).data('number')
  list_one = list_one + parseInt(number); // Gives 4
});

$(".two").each(function (i, val) {
  var number = $(this).data('number')
  list_two = list_two + parseInt(number); // Gives 10
});

但是随着列表的增长，这会变成一个又长又乱的代码。从前两个 li 获取值，然后是下两个，等等并将总和传递给变量的最佳方法是什么？

列表将始终具有这种结构，所以我不需要考虑每个类的 li 数量会有所不同。

Answer 1

您可以获得一个求和值的对象:

var result = {};

$('.list').each(function(idx, ele) {
    var key = ele.classList.toString().replace(/ /g,  '_');
    result[key] = (+result[key] || 0) +  +ele.dataset["number"];
});

console.log(result);

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


<ul>
    <li class="list one" data-number="2">one</li>
    <li class="list one" data-number="2">one</li>
    <li class="list two" data-number="3">two</li>
    <li class="list two" data-number="7">tow</li>
</ul>