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 源代码显示控件 (Ajax加载方式).
May 18 Javascript
基于JQuery的简单实现折叠菜单代码
Sep 15 Javascript
JQuery.ajax传递中文参数的解决方法 推荐
Mar 28 Javascript
浅析IE10兼容性问题(frameset的cols属性)
Jan 03 Javascript
JS小游戏之象棋暗棋源码详解
Sep 25 Javascript
jquery实现键盘左右翻页特效
Apr 30 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
JavaScript中原型链存在的问题解析
Sep 25 Javascript
jquery Easyui Datagrid实现批量操作(编辑,删除,添加)
Feb 20 Javascript
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 jQuery
Angular 2父子组件数据传递之局部变量获取子组件其他成员
Jul 04 Javascript
详解vue-cli项目中怎么使用mock数据
May 29 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
php处理斐波那契数列非递归方法
2012/02/04 PHP
ThinkPHP分组下自定义标签库实例
2014/11/01 PHP
解决Laravel 不能创建 migration 的问题
2019/10/09 PHP
PHP 进程池与轮询调度算法实现多任务的示例代码
2019/11/26 PHP
js 获取元素下面所有li的两种方法
2014/04/14 Javascript
在JavaScript中操作时间之setYear()方法的使用
2015/06/12 Javascript
js实现Select列表各项上移和下移的方法
2015/08/14 Javascript
初步使用Node连接Mysql数据库
2016/03/03 Javascript
论Bootstrap3和Foundation5网格系统的异同
2016/05/16 Javascript
jQuery中的on与bind绑定事件区别实例详解
2017/02/28 Javascript
iview table render集成switch开关的实例
2018/03/14 Javascript
Vue中的vue-resource示例详解
2018/11/02 Javascript
Vue 全家桶实现移动端酷狗音乐功能
2018/11/16 Javascript
使用mpvue搭建一个初始小程序及项目配置方法
2018/12/03 Javascript
Windows下支持自动更新的Electron应用脚手架的方法
2018/12/24 Javascript
浅谈KOA2 Restful方式路由初探
2019/03/14 Javascript
浅谈javascript错误处理
2019/08/11 Javascript
JS错误处理与调试操作实例分析
2020/04/13 Javascript
用Python写的图片蜘蛛人代码
2012/08/27 Python
Python httplib模块使用实例
2015/04/11 Python
利用Python命令行传递实例化对象的方法
2016/11/02 Python
python3+PyQt5+Qt Designer实现堆叠窗口部件
2018/04/20 Python
浅谈python脚本设置运行参数的方法
2018/12/03 Python
Python----数据预处理代码实例
2019/03/20 Python
python实现井字棋小游戏
2020/03/04 Python
python wsgiref源码解析
2021/02/06 Python
非常漂亮的CSS3百叶窗焦点图动画
2016/02/24 HTML / CSS
美国老牌主机服务商:iPage
2016/07/22 全球购物
世界上最大的乐器零售商:Guitar Center
2017/11/07 全球购物
社区党总支书记先进事迹材料
2014/01/24 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
2015年世界无烟日活动方案
2015/05/04 职场文书
追悼会悼词大全
2015/06/23 职场文书
html+css实现文字折叠特效实例
2021/06/02 HTML / CSS
Redis+Lua脚本实现计数器接口防刷功能(升级版)
2022/02/12 Redis
win10电脑关机快捷键是哪个 win10快速关机的几种方法
2022/08/14 数码科技