Javascript递归打印Document层次关系实例分析


Posted in Javascript onMay 15, 2015

本文实例讲述了Javascript递归打印Document层次关系的方法。分享给大家供大家参考。具体如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>递归显示节点层次关系</title>
<script type="text/javascript">
var ResultStr = "";
function ListNode(node,level) {
 PrintInfo(node, level);
 level++;
 var nodes = node.childNodes;
 for (var i = 0; i < nodes.length; i++) {
  if (nodes[i].hasChildNodes()) {
   ListNode(nodes[i], level); //递归
  }
  else {
   PrintInfo(nodes[i], level);
  }
 }
}
function getSpace(level) {
 var s = "";
 for (var i = 0; i < level; i++) {
  s+="!----"
 }
 return s;
}
function PrintInfo(node, level) {
 ResultStr += getSpace(level) + "Name:" + node.nodeName + 
 "...Type:" + node.nodeType + "...Value:" + node.nodeValue + "<br />";
}
function getDocAllInfo() {
 ResultStr = "";
 ListNode(document, 0);
 document.write(ResultStr);
}
</script>
</head>
<body>
<input type="button" value="测试" onclick="getDocAllInfo()" />
<div id="divDemo">div内容</div>
<table>
  <tr>
    <td>单元格1</td>
    <td>单元格2</td>
  </tr>
  <tr>
    <td>单元格3</td>
    <td>单元格4</td>
  </tr>
</table>
<input type="text" />
<span>我是SPAN</span>
<!--我是注释-->
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jquery索引在使用中的一些困惑
Oct 24 Javascript
利用JS解决ie6不支持max-width,max-height问题的方法
Jan 02 Javascript
js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法
Aug 11 Javascript
EasyUI的doCellTip实现鼠标放到单元格上提示单元格内容
Aug 24 Javascript
JavaScript实现同一个页面打开多张图片
Dec 29 Javascript
javascript实现日期三级联动下拉框选择菜单
Dec 03 Javascript
jQuery使用ajax_动力节点Java学院整理
Jul 05 jQuery
微信小程序模板和模块化用法实例分析
Nov 28 Javascript
细说webpack源码之compile流程-rules参数处理技巧(1)
Dec 26 Javascript
转换layUI的数据表格中的日期格式方法
Sep 19 Javascript
微信小程序实现选择地址省市区三级联动
Jun 21 Javascript
vue项目中播放rtmp视频文件流的方法
Sep 17 Javascript
Javascript节点关系实例分析
May 15 #Javascript
自己编写的支持Ajax验证的JS表单验证插件
May 15 #Javascript
Javascript中prototype属性实现给内置对象添加新的方法
May 14 #Javascript
Javascript进制转换实例分析
May 14 #Javascript
Javascript中For In语句用法实例
May 14 #Javascript
Javascript中With语句用法实例
May 14 #Javascript
javascript用函数实现对象的方法
May 14 #Javascript
You might like
解决PHP在DOS命令行下却无法链接MySQL的技术笔记
2010/12/29 PHP
php懒人函数 自动添加数据
2011/06/28 PHP
Thinkphp调用Image类生成缩略图的方法
2015/03/07 PHP
php实现对两个数组进行减法操作的方法
2015/04/17 PHP
php求数组全排列,元素所有组合的方法总结
2017/03/14 PHP
JavaScript 闭包在封装函数时的简单分析
2009/11/28 Javascript
js split 的用法和定义 js split分割字符串成数组的实例代码
2012/05/13 Javascript
JavaScript实现从数组中选出和等于固定值的n个数
2014/09/03 Javascript
javascript中parseInt()函数的定义和用法分析
2014/12/20 Javascript
JS实现适合于后台使用的动画折叠菜单效果
2015/09/21 Javascript
一个极为简单的requirejs实现方法
2016/10/20 Javascript
javascript实现将数字转成千分位的方法小结【5种方式】
2016/12/11 Javascript
javascript html5轻松实现拖动功能
2017/03/01 Javascript
vue父组件触发事件改变子组件的值的方法实例详解
2019/05/07 Javascript
操作按钮悬浮固定在微信小程序底部的实现代码
2019/08/02 Javascript
element跨分页操作选择详解
2020/06/29 Javascript
vue.js 输入框输入值自动过滤特殊字符替换中问标点操作
2020/08/31 Javascript
对python调用RPC接口的实例详解
2019/01/03 Python
python 一个figure上显示多个图像的实例
2019/07/08 Python
wxPython绘图模块wxPyPlot实现数据可视化
2019/11/19 Python
Python基于Socket实现简单聊天室
2020/02/17 Python
Python sys模块常用方法解析
2020/02/20 Python
python统计文章中单词出现次数实例
2020/02/27 Python
Python小白不正确的使用类变量实例
2020/05/29 Python
Html5之svg可缩放矢量图形_动力节点Java学院整理
2017/07/17 HTML / CSS
稀有和绝版书籍:Biblio.com
2017/02/02 全球购物
美国女孩洋娃娃店:American Girl
2017/10/24 全球购物
什么是静态路由?什么是动态路由?各自的特点是什么?
2015/09/16 面试题
实习生自荐信范文
2013/11/13 职场文书
万年牢教学反思
2014/02/15 职场文书
《诺贝尔》教学反思
2014/02/17 职场文书
借款协议书
2014/04/12 职场文书
工作年限证明模板
2015/06/15 职场文书
机关干部正风肃纪心得体会
2016/01/15 职场文书
2016年春季趣味运动会开幕词
2016/03/04 职场文书
python处理json数据文件
2022/04/11 Python