资讯专栏INFORMATION COLUMN

统计当前页面有多少个标签

宠来也 / 1794人阅读

摘要:统计当前页面含有多少个标签当前页面存在的标签个数为原生统计页面所有标签的种类存储标签的种类以及相应的个数

统计当前页面含有多少个标签
ES6
const domNames = Array.form(document.querySelectorAll("*")).map(v => v.tagName);
const result = new Set(domNames);
console.log(`当前页面存在的标签个数为: ${result.size}`);
JS
const dom = document.querySelectorAll("*");
const domNames = [];
Array.from(dom).forEach(v => {
  domNames.push(v.tagName);
});

const obj = {};
const newArr = [];
domNames.forEach(name => {
  if(!obj[name]) {
    newArr.push(name);
    obj[name] = true;
  }
});
console.log(newArr.length);
原生JS统计页面所有标签的种类
var all = document.querySelectorAll("*");
    var tags = [];
    all.forEach(item => {
      tags.push(item.tagName.toLocaleLowerCase());
    });

    // 存储标签的种类以及相应的个数
    var result = {};
    for(var i = 0; i < tags.length; i++) {
      if(!result[tags[i]]) {
        result[tags[i]] = 1;
      } else {
        result[tags[i]]++;
      }
    }
    
    console.log(res);
    console.log(Reflect.ownKeys(res).length);

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103245.html

相关文章

  • [聊一聊系列]聊一聊前端功能统计那些事儿

    摘要:欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面不仅仅是代码什么是功能统计作为一名开发,我们的产品发布出去之后,无论是产品还是运营,其实都是想及时了解产品对用户产生的影响的。下一章,我们将继续聊聊速度统计。 欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/bl...

    PAMPANG 评论0 收藏0
  • [聊一聊系列]聊一聊前端功能统计那些事儿

    摘要:欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面不仅仅是代码什么是功能统计作为一名开发,我们的产品发布出去之后,无论是产品还是运营,其实都是想及时了解产品对用户产生的影响的。下一章,我们将继续聊聊速度统计。 欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/bl...

    妤锋シ 评论0 收藏0
  • 为你的博客添加访问量统计

    摘要:所以我已经将服务迁移至上,有兴趣的同学请移步最新的一篇博文博客访问量统计工具查看最新版本的使用方法。但是针对博客的访问量统计,却没有什么可用的工具。 本文最初发布于我的个人博客:咀嚼之味 2016.04.23 通告: Hit Kounter 原本部署于 SAE 上,而近期 SAE 针对使用 MySQL 的应用开始收费。本项目只是一个本人使用业余时间开发的小工具;它本身包含的功能也很精...

    gekylin 评论0 收藏0

发表评论

0条评论

宠来也

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<