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 相关文章推荐
慎用 somefunction.prototype 分析
Jun 02 Javascript
ajax更新数据后,jquery、jq失效问题
Mar 16 Javascript
使用js操作css实现js改变背景图片示例
Mar 10 Javascript
Jquery对数组的操作技巧整理
Mar 25 Javascript
jQuery中removeData()方法用法实例
Dec 27 Javascript
js+HTML5基于过滤器从摄像头中捕获视频的方法
Jun 16 Javascript
浅谈js算法和流程控制
Dec 29 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
Apr 14 jQuery
Node.JS更改Windows注册表Regedit的方法小结
Aug 18 Javascript
VUE 实现滚动监听 导航栏置顶的方法
Sep 11 Javascript
vue3修改link标签默认icon无效问题详解
Oct 09 Javascript
微信小程序实现滑动翻页效果(完整代码)
Dec 06 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获取$_POST同名参数数组的实现介绍
2013/06/30 PHP
yii框架配置默认controller和action示例
2014/04/30 PHP
探寻PHP脚本不报错的原因
2014/06/12 PHP
在Yii框架中使用PHP模板引擎Twig的例子
2014/06/13 PHP
PHP浮点数的一个常见问题
2016/03/10 PHP
PHP Header失效的原因分析及解决方法
2016/11/16 PHP
tp5框架基于ajax实现异步删除图片的方法示例
2020/02/10 PHP
原生javascript实现的分页插件pagenav
2014/08/28 Javascript
AngularJS入门教程之 XMLHttpRequest实例讲解
2016/07/27 Javascript
AngularJS中$apply方法和$watch方法用法总结
2016/12/13 Javascript
nodejs个人博客开发第四步 数据模型
2017/04/12 NodeJs
Mac系统下Webstorm快捷键整理大全
2017/05/28 Javascript
JS中type=&quot;button&quot;和type=&quot;submit&quot;的区别
2017/07/04 Javascript
详解如何在vue项目中引入elementUI组件
2018/02/11 Javascript
vue2.0页面前进刷新回退不刷新的实现方法
2018/07/31 Javascript
深入理解JS中Number(),parseInt(),parseFloat()三者比较
2018/08/24 Javascript
vue form check 表单验证的实现代码
2018/12/09 Javascript
element-ui多文件上传的实现示例
2019/04/10 Javascript
解决vue单页面修改样式无法覆盖问题
2019/08/05 Javascript
Vue中jsx不完全应用指南小结
2019/11/01 Javascript
在react中使用vue的状态管理的方法示例
2020/05/02 Javascript
比较详细Python正则表达式操作指南(re使用)
2008/09/06 Python
用python写asp详细讲解
2013/12/16 Python
Python定时器实例代码
2017/11/01 Python
Python解决抛小球问题 求小球下落经历的距离之和示例
2018/02/01 Python
Python多线程处理实例详解【单进程/多进程】
2019/01/30 Python
python入门之基础语法学习笔记
2020/02/08 Python
DHC美国官网:日本通信销售第一的化妆品品牌
2017/11/12 全球购物
俄罗斯运动、健康和美容产品在线商店:Lactomin.ru
2020/07/23 全球购物
函授药学自我鉴定
2014/02/07 职场文书
机械专业技术员求职信
2014/06/14 职场文书
机电专业求职信
2014/06/14 职场文书
2015年教师见习期工作总结
2015/05/20 职场文书
比较node.js和Deno
2021/04/27 Javascript
Python中常见的导入方式总结
2021/05/06 Python
Hive HQL支持2种查询语句风格
2022/06/25 数据库