js获取html页面节点方法(递归方式)


Posted in Javascript onDecember 13, 2013

很久没有操作过递归调用了。看完之后,蓦然惊醒啊!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>统计Element节点</title>
   <script language="javascript">
         var  elementName="";
   function countTotalElement(node)
   {
       ///Attribute  nodeType值为2,表示节点属性
    ///Comment    nodeType值为8,表示注释文本
    ///Document   nodeType值为9,表示Document
    ///DocumentFragment   nodeType值为11,表示Document片段
    ///Element            nodeType值为1,表示元素节点
    ///Text               nodeType值为3,表示文本节点
       var total=0;
    if(node.nodeType==1) //1代表节点的类型为Element
    {
       total++;
    elementName=elementName+node.tagName+"\r\n";    }
    var childrens=node.childNodes;
    for(var i=0;i<childrens.length;i++)
    {
        total+=countTotalElement(childrens[i]);
    } 
    return total;
   }
   </script>
</head>

<body>
     <h1>测试</h1>
     <table width="100" border="2" cellpadding="0" cellspacing="0">
         <tr><td>
         <form name="form1" action="" method="post">
               <input type="text" name="ipput1" value="测试"><br />
               <input type="password" name="password" value="">
         </form>
         </td></tr>
     </table>
     <a href="javascript:void(0)" onClick="alert('标记总数'+countTotalElement(document)+'\r\n 全部标记如下:\r\n'+elementName);">开始测试</a>
</body>
</html>

其实,通过递归调用也可以实现 想百度蜘蛛爬虫一样的效果!这个值得一试,或许可以通过这个方法,写一个sitemap生成器!

Javascript 相关文章推荐
JavaScript国旗变换效果代码
Aug 13 Javascript
JS弹出窗口代码大全(详细整理)
Dec 21 Javascript
jquery插件unobtrusive实现片段式加载
Jun 15 Javascript
javascript作用域问题实例分析
Jul 13 Javascript
基于React.js实现原生js拖拽效果引发的思考
Mar 30 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 Javascript
js改变透明度实现轮播图的算法
Aug 24 Javascript
Angular2学习笔记——详解路由器模型(Router)
Dec 02 Javascript
layui+jquery支持IE8的表格分页方法
Sep 28 jQuery
序列化模块json代码实例详解
Mar 03 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
Oct 30 Javascript
Nuxt.js的路由跳转操作(页面跳转nuxt-link)
Nov 06 Javascript
jquery 合并内容相同的单元格(示例代码)
Dec 13 #Javascript
javascript读取xml实现javascript分页
Dec 13 #Javascript
同域jQuery(跨)iframe操作DOM(示例代码)
Dec 13 #Javascript
javascript分页代码实例分享(js分页)
Dec 13 #Javascript
jquery 操作iframe的几种方法总结
Dec 13 #Javascript
异步动态加载JS并运行(示例代码)
Dec 13 #Javascript
JQuery中$.ajax()方法参数详解及应用
Dec 12 #Javascript
You might like
西德产收音机
2021/03/01 无线电
php 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
Zend Framework分页类用法详解
2016/03/22 PHP
php cookie用户登录的详解及实例代码
2017/01/03 PHP
解决在Laravel 中处理OPTIONS请求的问题
2019/10/11 PHP
JQuery扩展插件Validate 2通过参数设置验证规则
2011/09/05 Javascript
JQuery分别取得每行最后一列和最后一行的示例代码
2013/08/18 Javascript
21个值得收藏的Javascript技巧
2014/02/04 Javascript
使用jquery实现以post打开新窗口
2014/03/19 Javascript
jquery实现图片放大镜功能
2015/11/23 Javascript
Jquery Easyui搜索框组件SearchBox使用详解(19)
2016/12/17 Javascript
关于JavaScript的单双引号嵌套问题
2017/08/20 Javascript
Vue 按键修饰符处理事件的方法
2018/05/04 Javascript
JS中Promise函数then的奥秘探究
2018/07/30 Javascript
微信小程序导航栏滑动定位功能示例(实现CSS3的positionsticky效果)
2019/01/24 Javascript
JavaScript 判断iPhone X Series机型的方法
2019/01/28 Javascript
JS计算两个数组的交集、差集、并集、补集(多种实现方式)
2019/05/21 Javascript
vue data有值,但是页面{{}} 取不到值的解决
2020/11/09 Javascript
[16:21]教你分分钟做大人:圣堂刺客
2014/12/03 DOTA
[38:32]完美世界DOTA2联赛循环赛 Forest vs DM 第二场 11.06
2020/11/06 DOTA
python list 合并连接字符串的方法
2013/03/09 Python
django上传图片并生成缩略图方法示例
2017/12/11 Python
python 多维切片之冒号和三个点的用法介绍
2018/04/19 Python
对Python+opencv将图片生成视频的实例详解
2019/01/08 Python
python多线程与多进程及其区别详解
2019/08/08 Python
Python run()函数和start()函数的比较和差别介绍
2020/05/03 Python
python调用jenkinsAPI构建jenkins,并传递参数的示例
2020/12/09 Python
常用的HTML5列表标签
2017/06/20 HTML / CSS
欧洲最大的婴幼儿服装及内衣公司:Petit Bateau(小帆船)
2016/08/16 全球购物
FILA斐乐中国官方商城:意大利运动品牌
2017/01/25 全球购物
英国家庭家具、照明和花园家具购物网站:Furniture123
2018/12/31 全球购物
迪卡侬印尼体育用品商店:Decathlon印尼
2020/03/11 全球购物
留学自荐信的技巧
2013/10/17 职场文书
单位在职证明范本
2014/01/09 职场文书
装修设计师求职信
2014/02/26 职场文书
党的群众路线对照检查材料思想汇报
2014/09/25 职场文书