JavaScript 统计当前页面标签个数和种类

最新推荐文章于 2023-03-27 20:04:12 发布

浪漫不属意

最新推荐文章于 2023-03-27 20:04:12 发布

阅读量1.7k

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.csdn.net/ohmyauthentic/article/details/60983571

版权

javascript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

简单的遍历，熟悉一下dom节点的属性，用的是html Dom ,节点还可以用xml 的dom来解析比如把children 换成childNodes,文本节点便会被统计进来，顺便实现了简单的map功能

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div class="section">
        <input id="search"/>
        <input id="search"/>
        <input id="search"/>
        <input id="search"/>
        <ul id="datalist">
          <li></li>
          <li></li>
          <li></li>
          <li></li>
        </ul>
    </div>
  </body>
  <script type="text/javascript">

    var map = {};
    function printTree(node){
      // console.log(node.nodeName.toLowerCase(),node.nodeType);
      var temp_tag = node.nodeName.toLowerCase();
      if(map[temp_tag]!=null)map[temp_tag]++;
      else map[temp_tag]=1;
      if(node.children!=null){

        for (var i = 0; i < node.children.length; i++) {
          printTree(node.children[i]);
        }
      }else {return;};
    }

    window.onload = function(){
      printTree(document.body);
      for (o in map) {
        console.log(o+':'+map[o]);
      }
    }
  </script>
</html>