时间戳

首页 > 解决方案 > 按值分组的数据属性计算其他数据属性的总和

javascript - 按值分组的数据属性计算其他数据属性的总和

问题描述

我正在尝试计算huishoudens每个provincie. 对于这个问题，我创建了一个小提琴，可以在这里找到：http: //jsfiddle.net/Lyf1sak3/1/

使用此示例数据：

<div data-provincie="Noord-Holland" data-huishoudens="102"></div>
<div data-provincie="Noord-Holland" data-huishoudens="1250"></div>
<div data-provincie="Zuid-Holland" data-huishoudens="956"></div>
<div data-provincie="Zuid-Holland" data-huishoudens="235"></div>
<div data-provincie="Groningen" data-huishoudens="495"></div>
<div data-provincie="Groningen" data-huishoudens="55"></div>
<div data-provincie="Groningen" data-huishoudens="247"></div>
<div data-provincie="Utrecht" data-huishoudens="123"></div>
<div data-provincie="Utrecht" data-huishoudens="675"></div>

而这段代码：

var provincies = {},
    provincie;
    sum = 0;
$('*[data-provincie]').each(function(i, el){
    provincie = $(el).data('provincie');
    
    if (provincies.hasOwnProperty(provincie)) {

        provincies[provincie] += 1;
        sum += $(this).data('huishoudens');

    }
    else {
        provincies[provincie] = 1;
    }
});

// print results
$('#result').append('<hr>');
for(var key in provincies){
    $('#result').append(key + ' (' + provincies[key] + '|' + sum + ')<br>');
}

我provincie按自己的属性对每个属性进行分组，现在我只需要计算其他数据属性，但我完全被困在这里。我得到的结果要么675是样本数据中的最后一个 div，要么我得到2462了，但我不知道它是如何得到这个数字的。

我需要修改什么才能得到这个结果：

Noord-Holland (2|1352)
Zuid-Holland (2|1191)
Groningen (3|797)
Utrecht (2|798)

无论您给出什么答案都非常感谢，但请不要在需要硬编码provincie类似名称的地方发布答案$('*[data-provincie="Noord-Holland"]');

标签： javascriptjquery

解决方案

如果您知道provincie之前只有您可以创建一个包含 all 的数组，provincie然后您可以将其用作键来将其与所有divif 匹配项进行比较，您可以将其添加到sum变量中，最后将最终结果附加到您的resultdiv 中。

演示代码：

//all data provinces
//var json_ = ["Noord-Holland", "Zuid-Holland", "Groningen", "Utrecht"]
var json_ = [];
$('*[data-provincie]').each(function(i, el) {
//check if in array or not
  if ($.inArray($(this).data('provincie'), json_) < 0) {
    json_.push($(this).data('provincie'));//push same
  }

});
console.log(json_)
sum = 0;
count = 0;
//loop through keys
for (var key in json_) {
  $('*[data-provincie]').each(function(i, el) {
    var provincie = $(el).data('provincie');
    //if key matches
    if (json_[key] == provincie) {
      sum += $(el).data('huishoudens');
      count++;
    }
  });
  //append result
  $('#result').append(count + ' (' + json_[key] + '|' + sum + ')<br/>')
  count = 0;
  sum = 0 //change sum to 0 again
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div data-provincie="Noord-Holland" data-huishoudens="102"></div>
<div data-provincie="Noord-Holland" data-huishoudens="1250"></div>
<div data-provincie="Zuid-Holland" data-huishoudens="956"></div>
<div data-provincie="Zuid-Holland" data-huishoudens="235"></div>
<div data-provincie="Groningen" data-huishoudens="495"></div>
<div data-provincie="Groningen" data-huishoudens="55"></div>
<div data-provincie="Groningen" data-huishoudens="247"></div>
<div data-provincie="Utrecht" data-huishoudens="123"></div>
<div data-provincie="Utrecht" data-huishoudens="675"></div>

<div id="result"></div>

推荐阅读