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 相关文章推荐
javascript中获取选中对象的类型
Apr 02 Javascript
JavaScript中的细节分析
Jun 30 Javascript
js给页面加style无效果的解决方法
Jan 20 Javascript
Egret引擎开发指南之视觉编程
Sep 03 Javascript
form.submit()不能提交表单的原因分析
Oct 23 Javascript
AngularJS过滤器filter用法分析
Dec 11 Javascript
js实现获取鼠标当前的位置
Dec 14 Javascript
jQuery实现两个select控件的互移操作
Dec 22 Javascript
Vue 2.0学习笔记之使用$refs访问Vue中的DOM
Dec 19 Javascript
如何根据业务封装自己的功能组件
Apr 19 Javascript
JavaScript判断浏览器版本的方法
Nov 03 Javascript
js实现磁性吸附的示例
Oct 26 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安装攻略:常见问题解答(一)
2006/10/09 PHP
详解PHP中的序列化、反序列化操作
2017/03/21 PHP
Thinkphp5.0 框架的请求方式与响应方式分析
2019/10/14 PHP
通用于ie和firefox的函数 GetCurrentStyle (obj, prop)
2006/12/27 Javascript
用javascript实现计算两个日期的间隔天数
2007/08/14 Javascript
js 单引号 传递方法
2009/06/22 Javascript
Jquery 组合form元素为json格式,asp.net反序列化
2009/07/09 Javascript
IE iframe的onload方法分析小结
2010/01/07 Javascript
js前台分页显示后端JAVA数据响应
2013/03/18 Javascript
什么是Node.js?Node.js详细介绍
2014/06/01 Javascript
详细分析JavaScript变量类型
2015/07/08 Javascript
JavaScript中split与join函数的进阶使用技巧
2016/05/03 Javascript
javascript实现秒表计时器的制作方法
2017/02/16 Javascript
微信小程序本作用域下调用全局JS详解及实例
2017/02/22 Javascript
详解Angular 4 表单快速入门
2017/06/05 Javascript
node+koa实现数据mock接口的方法
2017/09/20 Javascript
CheckBox多选取值及判断CheckBox选中是否为空的实例
2017/10/31 Javascript
Vue 自定义动态组件实例详解
2018/03/28 Javascript
小程序如何在不同设备上自适应生成海报的实现方法
2019/08/20 Javascript
layui框架与SSM前后台交互的方法
2019/09/12 Javascript
Python中的MongoDB基本操作:连接、查询实例
2015/02/13 Python
Python中基础的socket编程实战攻略
2016/06/01 Python
pycharm 将django中多个app放到同个文件夹apps的处理方法
2018/05/30 Python
Pyqt QImage 与 np array 转换方法
2019/06/27 Python
Python中print函数简单使用总结
2019/08/05 Python
python创建学生管理系统
2019/11/22 Python
Python3操作读写CSV文件使用包过程解析
2020/04/10 Python
理解Django 中Call Stack机制的小Demo
2020/09/01 Python
python 如何使用find和find_all爬虫、找文本的实现
2020/10/16 Python
经典C++面试题一
2016/11/06 面试题
华三通信H3C面试题
2015/05/15 面试题
税务干部鉴定材料
2014/02/11 职场文书
酒店辞职书怎么写
2015/02/26 职场文书
数学教师求职信范文
2015/03/20 职场文书
借条格式范本
2015/05/25 职场文书
详解Java实践之抽象工厂模式
2021/06/18 Java/Android