js统计元素个数

最新推荐文章于 2025-06-30 10:26:45 发布
最新推荐文章于 2025-06-30 10:26:45 发布
阅读量3.8k 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： JavaScript 文章标签： javascript xhtml table border function html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/diligentcatrich/article/details/6758231
本文介绍了一个使用JavaScript编写的函数，该函数可以统计HTML文档中所有元素的数量，并展示这些元素的名称。通过递归遍历DOM树，实现了对任意复杂度页面的统计。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

 

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default7.aspx.cs" Inherits="Default7" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>无标题文档</title>

<script language="javascript">

var elementName = ""; //全局变量，保存Element标记名，使用完毕要清空

function countTotalElement(node) { //参数node是一个Node对象

    var total = 0;


 if(node.nodeType == 1) { //检查node是否为Element对象

 total++; //如果是，计数器加1

 elementName = elementName + node.tagName + "\r\n"; //保存标记名

 }
 if (node.hasChildNodes()) {
     var childrens = node.childNodes; //获取node的全部子节点

     for (var i = 0; i < childrens.length; i++) {

         total += countTotalElement(childrens[i]); //在每个子节点上进行递归操作

     }
 }

 return total;

}

</script>

<style type="text/css">
<!--
#FF {
position:absolute;
left:138px;
top:41px;
width:172px;
height:116px;
z-index:1;
}
#Layer2 {
position:absolute;
left:171px;
top:63px;
width:99px;
height:62px;
z-index:2;
}
-->
</style>
</head>

<body>
<a href="javascript:void(0)" 

onClick="alert('标记总数：' + countTotalElement(document.getElementById('table1')) + '\r\n全部标记如下：\r\n' + elementName);elementName='';">开始统计</a>
<table id="table1" width="60%" border="0" cellspacing="0" cellpadding="0" id="FF">
 <tr>
 <td><a href=""></a></td>
 </tr>
  <tr>
 <td><a href=""></a></td>
 </tr>
</table> <a href=""></a>
</body>

</html>

汇编语言程序设计之统计元素个数
zbp_12138的博客
12-27 3077
汇编语言程序设计之统计元素个数前言题目描述题目分析参考代码程序使用指令详解六大标志位CF——进位标志位PF——奇偶标志位AF——辅助进位标志位ZF——零标志位SF——符号标志位OF——溢出标志位XOR指令OR指令LEA——取偏移地址指令LODSB——串装入指令条件转移指令程序执行过程详解 前言 统计元素个数这样的问题，思路其实很简单，用高级语言来实现的话，几行代码就可以搞定，但是如果要用汇编语言来实现的话，代码量会稍微多一些，但解题思路其实是一样的。 题目描述 在内存数据段处存放有10个8位带符号数，其首地
JS统计一个字符串中数字字符的个数。
qq_46700766的博客
03-06 8093
** JS统计一个字符串中数字字符的个数。 ** 思路整理： 统计一个字符串中的数字字符个数，首先应该先遍历字符串中每一个单字符，然后对每个字符进行判断是否为数字，最后设置一个变量统计数目 具体实现： 1、首先对字符串进行拆分，使用到的是split（“”）把字符串分割为单字符并以数组形式保存。 2、得到的数组现在依然不能直接进行判断的，因为此时的数组中存储的依然是字符形式，所以需要进一步地转化成数字形式。 3、利用Number函数遍历数组将字符转换成Number类型。 4、转化后的值只能以NaN或者是数字类
js 统计数组中元素的个数
weixin_30367945的博客
03-16 5342
var all = "02 06 11 12 19 29 09 10 12 19 22 29 08 11 13 19 28 31 07 08 09 15 22 27 10 18 19 29 32 33 05 07 10 23 28 29 01 07 10 16 22 33 11 12 13 16 23 25 07 09 18 22 23 29 03 06 13 14 19 28 03 05 06 ...
用JS来统计数组元素个数
weixin_54191015的博客
03-03 1090
给定一个数组或任意一个数组，要求输出数组的长度（即元素个数）。可以使用 JavaScript 来实现。
十大排序算法汇总
最新发布
weixin_47868976的博客
06-30 845
涵盖。
js数组：统计数组每个元素的个数
qq_44697303的博客
03-28 7565
1.返回key-value数据结构 { "aaa":"lang", "bbb":"yun", "ccc":"song" } 特点：简单易见，但只能封装原始值数组 代码： function countArr(arr) { var hash = {}; arr.forEach((element) => { if(!hash[element]){ hash[element]=1; } else{ hash[
统计数组中元素出现个数JS
weixin_42824754的博客
02-17 1950
统计数组中元素出现个数
JavaScript获取对象中元素个数
a_dev的专栏
03-24 6446
var layerGroups = {}; layerGroups[layerGroup].push(layer); var groupCount = Object.getOwnPropertyNames(layerGroups).length;
JavaScript重复元素处理方法分析【统计个数、计算、去重复等】
10-18
在本文中，我们将详细讨论在字符串和数组中处理重复元素的技巧，包括统计元素出现的次数、计算特定条件下的元素个数以及去除重复元素的方法。 首先，我们来看如何统计字符串中某个字符出现的次数。这可以通过创建一...
JS实现区分中英文并统计字符个数的方法示例
10-18
首先，让我们关注标题和描述中提到的关键内容："JS实现区分中英文并统计字符个数的方法示例"和"涉及JavaScript事件响应、正则匹配及数值运算相关操作技巧"。这里有两个核心技术点需要我们深入理解： 1. **...
JS实现数组去重,显示重复元素及个数的方法示例
10-17
2. **JavaScript对象操作**：通过对象的键值对可以方便地统计数组中每个元素出现的次数。在给定代码中，使用了对象`obj`来记录每个元素（键）出现的次数（值）。 3. **数组遍历方法**：数组遍历是数组操作的基本...
JS实现统计复选框选中个数并提示确定与取消的方法
10-24
本文介绍了一种使用JavaScript来实现统计页面中复选框选中个数，并在用户选择确定或取消后执行相应操作的方法。具体知识点包括： 1. JavaScript中的document.getElementsByName()方法：此方法用于获取具有相同name...
6.JavaScript中获取数组中的元素数量及去重
qq_44438941的博客
09-15 1651
日常总结
js从数组中计算出每个数的个数
weixin_44769592的博客
06-05 3298
题目 'use strict'; var grouping_count = require("../../main/filter/grouping_count.js"); describe('grouping_count', function() { var collection = [1,1,1,1,2,3,1,3,4,2,3,1,3,4,2]; it('从collection中...
js统计标签数量
第三世界的博客
11-03 2080
1、js统计标签的数量写法： document.getElementById("pp").getElementsByTagName("a").length; jquery这样写。$("#pp a").index()+1; 2、d只能出现一次哦，js的代码有了，jquery代码可以再简单一点。$("#pp a").length; 3、一个页面中不能出现相同的两个Id,可以有多个相同的c
js -- 统计个数（算法相关）
lswaone的博客
04-15 1950
JS中查询数组指定元素的个数
热门推荐
qq_42640067的博客
06-27 1万+
在JS中，有时我们需要查询某个数组中指定元素的个数，并没有方法可以直接统计指定元素个数的，我们可以借助JS数组提供的filter()方法来间接实现。先来看看这个方法，代码如下： <script> var myArrays = new Array(); for(var i=1;i<=10;i++) { myArrays.push(i); } console.log(myArrays); // filter方法过滤，返回数组，并不会影响原数组 var newArrays
JS 获取一个对象里面第一层元素的数量
u011927449的博客
08-10 664
function getObjectLength(obj) { var i = 0; for(var k in obj){ i++; } return i; } var obj = { a: 1, b: 2, c: { c1: 3, c2: 4 } }; console.log(getObjectLength(obj)); // 3
js获取元素的方法
zybijiso666的博客
08-01 5095
getElementsByClassName()方法返回一个包含了所有指定类名的子元素的类数组对象，作为nodeList对象。documentElement是整个节点树的根节点，即html标签 HTML文档返回对象为HTML元素。getElementsByTagName()方法返回一个动态的包含所有指定标签名的元素的。(documentElement是一个会返回文档对象的根元素的只读属性)documentElement属性以一个元素对象返回一个文档的文档元素。如果HTML元素缺失，返回值为null。
js统计数组中元素个数
05-07
### 如何使用 JavaScript 统计数组中元素的个数 在 JavaScript 中，可以通过多种方式来统计数组中的元素个数。以下是几种常见的实现方法： #### 方法一：使用 `Array.prototype.reduce` 进行统计 通过 `reduce` 方法可以遍历整个数组并累积每个唯一值的数量。 ```javascript const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'apple']; const count = arr.reduce((acc, fruit) => { acc[fruit] = (acc[fruit] || 0) + 1; return acc; }, {}); console.log(count); // { apple: 3, banana: 2, orange: 1 } ``` 此代码片段利用了 `reduce` 函数[^5]，其中初始值设置为空对象 `{}`，每次迭代都会更新当前项对应的键值数量。 #### 方法二：使用循环手动构建频率表 也可以采用传统的 `for` 循环或者增强型 `for...of` 来完成同样的功能。 ```javascript const fruits = ['apple', 'banana', 'apple', 'orange', 'banana', 'apple']; let frequencyTable = {}; for (const item of fruits) { if (!frequencyTable[item]) { frequencyTable[item] = 0; } frequencyTable[item]++; } console.log(frequencyTable); // { apple: 3, banana: 2, orange: 1 } ``` 这种方法更加直观易懂，并且适用于任何版本支持 ES6 的环境[^6]。 #### 方法三：借助第三方库（如 Lodash） 如果允许引入外部依赖，则像 Lodash 这样的工具集提供了非常简洁的方法来做这件事。 ```javascript // 假设已安装 lodash 并导入 _ const _ = require('lodash'); const items = ['red', 'green', 'blue', 'yellow', 'green', 'blue']; const counts = _.countBy(items); console.log(counts); // { red: 1, green: 2, blue: 2, yellow: 1 } ``` 这里展示了如何运用 Lodash 提供的功能快速解决问题[^7]。 以上就是三种主要途径用于计算给定列表里各成员出现次数的方式介绍完毕！
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值