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 相关文章推荐
jQuery Dialog 弹出层对话框插件
Aug 09 Javascript
JQuery 拾色器插件发布-jquery.icolor.js
Oct 20 Javascript
JS等比例缩小图片尺寸的实例
Feb 27 Javascript
JavaScript中的分号插入机制详细介绍
Feb 11 Javascript
EasyUI,点击开启编辑框,并且编辑框获得焦点的方法
Mar 01 Javascript
Jquery实现简单的轮播效果(代码管用)
Mar 14 Javascript
JS JSOP跨域请求实例详解
Jul 04 Javascript
JS中的==运算: [''] == false —&gt;true
Jul 24 Javascript
Angularjs实现mvvm式的选项卡示例代码
Sep 08 Javascript
JavaScript创建表格的方法
Apr 13 Javascript
解决vux 中popup 组件Mask 遮罩在最上层的问题
Nov 03 Javascript
基于vue+echarts数据可视化大屏展示的实现
Dec 25 Vue.js
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
php不写闭合标签的好处
2014/03/04 PHP
如何使用PHP对网站验证码进行破解
2015/09/17 PHP
详谈PHP中的密码安全性Password Hashing
2017/02/04 PHP
关于php几种字符串连接的效率比较(详解)
2017/02/22 PHP
PHP读取并输出XML文件数据的简单实现方法
2017/12/22 PHP
Laravel框架源码解析之反射的使用详解
2020/05/14 PHP
PHP基于ip2long实现IP转换整形
2020/12/11 PHP
让IE6支持min-width和max-width的方法
2010/06/25 Javascript
Prototype源码浅析 Enumerable部分之each方法
2012/01/16 Javascript
GridView中获取被点击行中的DropDownList和TextBox中的值
2013/07/18 Javascript
js 三级关联菜单效果实例
2013/08/13 Javascript
轻松创建nodejs服务器(4):路由
2014/12/18 NodeJs
js关于命名空间的函数实例
2015/02/05 Javascript
easyui combotree加载静态数据问题(选不上)解决方法
2016/12/26 Javascript
vuex state及mapState的基础用法详解
2018/04/19 Javascript
jQuery的Ajax接收java返回数据方法
2018/08/11 jQuery
mpvue全局引入sass文件的方法步骤
2019/03/06 Javascript
Javascript中的this,bind和that使用实例
2019/12/05 Javascript
JS实现动态倒计时功能(天数、时、分、秒)
2019/12/12 Javascript
vue 实现图片懒加载功能
2020/12/31 Vue.js
antdesign-vue结合sortablejs实现两个table相互拖拽排序功能
2021/01/08 Vue.js
Python标准库defaultdict模块使用示例
2015/04/28 Python
在Python中使用PIL模块对图片进行高斯模糊处理的教程
2015/05/05 Python
Python实现数据结构线性链表(单链表)算法示例
2019/05/04 Python
PYQT5开启多个线程和窗口,多线程与多窗口的交互实例
2019/12/13 Python
windows、linux下打包Python3程序详细方法
2020/03/17 Python
终于搞懂了Keras中multiloss的对应关系介绍
2020/06/22 Python
Python基于opencv的简单图像轮廓形状识别(全网最简单最少代码)
2021/01/28 Python
俄罗斯童装网上商店:BebaKids
2020/06/06 全球购物
运动会广播稿30字
2014/01/21 职场文书
实习生求职自荐信
2014/02/07 职场文书
教师党员一句话承诺
2014/03/28 职场文书
食品安全工作方案
2014/05/07 职场文书
户籍证明格式
2014/09/15 职场文书
python之基数排序的实现
2021/07/26 Python
详细聊聊Oracle表碎片对性能有多大的影响
2022/03/19 Oracle