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 相关文章推荐
Use Word to Search for Files
Jun 15 Javascript
jquery miniui 教程 表格控件 合并单元格应用
Nov 25 Javascript
博客侧边栏模块跟随滚动条滑动固定效果的实现方法(js+jquery等)
Mar 24 Javascript
基于jquery自定义的漂亮单选按钮RadioButton
Nov 19 Javascript
js jquery获取当前元素的兄弟级 上一个 下一个元素
Sep 01 Javascript
基于dropdown.js实现的两款美观大气的二级导航菜单
Sep 02 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
Nov 27 Javascript
Vue js 的生命周期(看了就懂)(推荐)
Mar 29 Javascript
vue 地图可视化 maptalks 篇实例代码详解
May 21 Javascript
生成无限制的微信小程序码的示例代码
Sep 20 Javascript
在vue中使用console.log无效的解决
Aug 09 Javascript
vue打开其他项目页面并传入数据详解
Nov 25 Vue.js
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
codeigniter数据库操作函数汇总
2014/06/12 PHP
php使用date和strtotime函数输出指定日期的方法
2014/11/14 PHP
thinkPHP实现表单自动验证
2014/12/24 PHP
常用的javascript function代码
2008/05/23 Javascript
Javascript String对象扩展HTML编码和解码的方法
2009/06/02 Javascript
Javascript跨域请求的4种解决方式
2013/03/17 Javascript
js点击事件链接的问题解决
2014/04/25 Javascript
AngularJS模块管理问题的非常规处理方法
2015/04/29 Javascript
ArtEditor富文本编辑器增加表单提交功能
2016/04/18 Javascript
基于vue2.0+vuex的日期选择组件功能实现
2017/03/13 Javascript
前端常见跨域解决方案(全)
2017/09/19 Javascript
Node.js学习之TCP/IP数据通讯(实例讲解)
2017/10/11 Javascript
vue中路由验证和相应拦截的使用详解
2017/12/13 Javascript
React 组件间的通信示例
2018/06/14 Javascript
js根据json数据中的某一个属性来给数据分组的方法
2018/10/08 Javascript
创建echart多个联动的示例代码
2018/11/23 Javascript
详解json串反转义(消除反斜杠)
2019/08/12 Javascript
vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】
2020/06/01 Javascript
[09:59]DOTA2-DPC中国联赛2月7日Recap集锦
2021/03/11 DOTA
跟老齐学Python之关于类的初步认识
2014/10/11 Python
Python的re模块正则表达式操作
2016/05/25 Python
Python之文字转图片方法
2018/05/10 Python
python中property属性的介绍及其应用详解
2019/08/29 Python
pytorch制作自己的LMDB数据操作示例
2019/12/18 Python
CSS3不透明度实例讲解
2016/04/26 HTML / CSS
HTML5 canvas实现雪花飘落特效
2016/03/08 HTML / CSS
html5 Canvas画图教程(5)—canvas里画曲线之arc方法
2013/01/09 HTML / CSS
澳大利亚男士西服品牌:M.J.Bale
2018/02/06 全球购物
摩飞电器俄罗斯官方网站:Morphy Richards俄罗斯
2020/07/30 全球购物
定义一结构体变量,用其表示点坐标,并输入两点坐标,求两点之间的距离
2015/08/17 面试题
招商业务员岗位职责
2013/12/16 职场文书
物业公司的岗位任命书
2014/06/06 职场文书
法人代表证明书格式
2014/10/01 职场文书
如何有效防止sql注入的方法
2021/05/25 SQL Server
使用springMVC所需要的pom配置
2021/09/15 Java/Android
SQL Server数据库基本概念、组成、常用对象与约束
2022/03/20 SQL Server