Question

HTML

<html>
    <head></head>
    <body>
        <p></p>
        <p></p>
        <div></div>
        <div></div>
        <div></div>
    </body>
</html>

JS

document.getElementsByTagName("*").length // 8

如何计算每个标记名称的数量（类似于SQL中的GROUP BY）以获取如下对象：

{
    html: 1
    head: 1
    body: 1
    p: 2
    div: 3
}

我可以使用多行代码获得结果，但也许只能在几行代码中执行此操作？

Answer 1

您可以使用返回的NodeList的tagName属性并计算

＆＃13;

var count = {};

Array.prototype.forEach.call(document.getElementsByTagName("*"), function (a) {
    count[a.tagName] = (count[a.tagName] || 0) + 1;
});

console.log(count);

＆＃13;

Answer 2

你可以用，

var result = {};

[...document.getElementsByTagName("*")].forEach(function(itm) {
  var tag = itm.tagName;
  this[tag] = this[tag] || 0;
  this[tag]++;
}, result);

console.log(result);

如果您的环境不支持spread运算符，则在使用forEach之前手动将nodeList转换为数组。或者我们可以用传统的for()循环来编写它。

var result = {}, tag;
var elems = document.getElementsByTagName("*");

for(var i=0;i<elems.length;i++){
  tag = elems[i].tagName;
  result[tag] = result[tag] || 0;
  result[tag]++;
}

console.log(result);

使用Javascript按标签元素分组

2 个答案: