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 1.4 中的Ajax问题
Jan 23 Javascript
提高jQuery性能的十个诀窍
Nov 14 Javascript
javascript制作2048游戏
Mar 30 Javascript
JS实现窗口加载时模拟鼠标移动的方法
Jun 03 Javascript
Bootstrap自动适应PC、平板、手机的Bootstrap栅格系统
May 27 Javascript
Bootstrap编写一个兼容主流浏览器的受众巨幕式风格页面
Jul 01 Javascript
easyui messager alert 三秒后自动关闭提示的实例
Nov 07 Javascript
微信小程序(三):网络请求
Jan 13 Javascript
React Native第三方平台分享的实例(Android,IOS双平台)
Aug 04 Javascript
JavaScript基础之静态方法和实例方法分析
Dec 26 Javascript
layui table 表格模板按钮的实例代码
Sep 21 Javascript
js HTML DOM EventListener功能与用法实例分析
Apr 27 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容易被忽略而出错陷阱 数字与字符串比较
2011/11/10 PHP
MacOS 安装 PHP的图片裁剪扩展Tclip
2015/03/25 PHP
PHP中的traits简单使用实例
2015/05/13 PHP
浅谈PHP匿名函数和闭包
2019/03/08 PHP
FormValid0.5版本发布,带ajax自定义验证例子
2007/08/17 Javascript
javascript中的prototype属性实例分析说明
2010/08/09 Javascript
js实现图片点击左右轮播
2015/07/08 Javascript
小议JavaScript中Generator和Iterator的使用
2015/07/29 Javascript
JS模拟实现方法重载示例
2016/08/03 Javascript
纯JS实现可拖拽表单的简单实例
2016/09/02 Javascript
微信小程序购物商城系统开发系列-目录结构介绍
2016/11/21 Javascript
yarn的使用与升级Node.js的方法详解
2017/06/04 Javascript
AngularJS集合数据遍历显示的实例
2017/12/27 Javascript
UEditor 自定义图片视频尺寸校验功能的实现代码
2020/10/20 Javascript
python简单实现计算过期时间的方法
2015/06/09 Python
总结python实现父类调用两种方法的不同
2017/01/15 Python
django 常用orm操作详解
2017/09/13 Python
使用Python进行AES加密和解密的示例代码
2018/02/02 Python
Python3实现从排序数组中删除重复项算法分析
2019/04/03 Python
PyQt5通信机制 信号与槽详解
2019/08/07 Python
python使用多线程编写tcp客户端程序
2019/09/02 Python
Python matplotlib绘制饼状图功能示例
2019/09/10 Python
Python3 合并二叉树的实现
2019/09/30 Python
用CSS3实现Win8风格的方格导航菜单效果
2013/04/10 HTML / CSS
电信营业员自我评价分享
2014/01/17 职场文书
办公室打字员岗位职责
2014/04/16 职场文书
合作经营协议书范本
2014/04/17 职场文书
无传销社区工作方案
2014/05/13 职场文书
民事诉讼授权委托书范文
2014/08/02 职场文书
2014年幼儿园重阳节活动方案
2014/09/16 职场文书
社区五一劳动节活动总结
2015/02/09 职场文书
白银帝国观后感
2015/06/17 职场文书
资产移交协议书
2016/03/24 职场文书
使用PDF.js渲染canvas实现预览pdf的效果示例
2021/04/17 Javascript
python 破解加密zip文件的密码
2021/04/22 Python
JavaScript中时间格式化新思路toLocaleString()
2021/11/07 Javascript