基础:

  JS nodeType返回类型:http://blog.csdn.net/qyf_5445/article/details/9232907

代码:

<!DOCTYPE html>
<html>
<head>
<title>遍历文档树</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript">
//遍历文档树
function getDomTree(){
alert(text(document.body)); //用提示框显示树内容
}
function text(elem){
var t=""; //定义文字字符串
//获取改节点的所有子节点
var elemelem = elem.childNodes;
//遍历所有子节点
for(var i=0; i<elemelem.length;i++){
//当前节点
var e = elemelem[i];
//文本、注释节点不被遍历,并判断其是否为直接父节点
if(e.parentNode == elem && e.nodeType == 1){
t += e.tagName + ' '; //把标签名添加到文本内容里
//循环子节点
if(e.childNodes.length > 0){
//如果子节点只有一个文本子节点,则跳过
if(e.childNodes.length == 1){
var fe = e.childNodes[0];
if(fe.nodeType == 3) //是否为文本子节点
continue; //跳过
}
t += '\n\t'; //子节点分隔符
t += text(e); //递归还有子元素的子节点
}
}
}
return t; //返回得到的文本
}
</script>
</head>
<body style="text-align:center">
<p>
<!-- 定义链接和按钮 -->
<a id="myLink" href="#">链接</a>
<br/>
<input type="button" value="遍历文档树" onclick="getDomTree();"/>
</p>
</body>
</html>

效果:

 

DOM操作-遍历HTML文档内容的更多相关文章

  1. DOM学习之充实文档内容

    HTML代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <me ...

  2. XML DOM 遍历Xml文档

    1.xml文档内容: <?xml version="1.0" encoding="utf-8" ?> <bookstore> <b ...

  3. java操作office和pdf文件java读取word,excel和pdf文档内容

    在平常应用程序中,对office和pdf文档进行读取数据是比较常见的功能,尤其在很多web应用程序中.所以今天我们就简单来看一下Java对word.excel.pdf文件的读取.本篇博客只是讲解简单应 ...

  4. PHPExcel 是用来操作Office Excel 文档的一个PHP类库

    PHPExcel 是用来操作Office Excel 文档的一个PHP类库,它基于微软的OpenXML标准和PHP语言.可以使用它来读取.写入不同格式的电子表格,如 Excel (BIFF) .xls ...

  5. 运用 Range 对象处理 Word 文档内容

    运用 Range 对象处理 Word 文档内容   在所有 Office 应用程序中,Microsoft Word 可能是应用最广泛的应用程序,它还经常在自定义 Office 解决方案中扮演重要的角色 ...

  6. 织梦DedeCMS首页调用单页文档内容的方法

    很多使用织梦dedecms单页文档功能的朋友都想知道如何在织梦首页调用单页文档的内容,下面就教大家具体的实现方法: 具体步骤如下: 首先在首页模板需要显示单页文档内容的地方插入如下代码: {dede: ...

  7. Mongodb(2)创建数据库,删除数据库,创建集合,删除集合,显示文档内容

    显示所有数据库列表:show dbs > show dbs local .078GB runoob .078GB > 显示当前数据库:db > db runoob > 显示所有 ...

  8. Citrix 服务器虚拟化之二十八 XenApp6.5发布文档内容

    Citrix 服务器虚拟化之二十八  XenApp 6.5发布文档内容 XenApp可发布以下类型的资源向用户提供信息访问,这些资源可在服务器或桌面上虚拟化: 1)  服务器桌面:发布场中服务器的整个 ...

  9. jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档。

    jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档. jquery.cookie中的操作: jquery.cookie.js是一个基于jquer ...

随机推荐

  1. FD.io vpp 框架转发图

    在ip4-icmp-input 与 ip4-udp-input后可以注册后续的处理函数,ip4-icmp-input根据 icmp的报文类型选择相应的处理函数,而ip4-udp-input根据端口选择 ...

  2. 安装linux工作环境

    1,介绍Vagrant 我们做web开发的时候经常要安装各种本地测试环境,比如apache,php,mysql,redis等等.出于个人使用习惯,可能我们还是比较习惯用windows.虽然说在wind ...

  3. MyEclipse中用Maven创建Web项目

    方法/步骤     new --> other   1.Wizards: mvaen 2.Maven Project 3.Next   Use Default Workspace Locatio ...

  4. PHP单例模式--典型的三私一公

    单例模式:即一个类只被实例化一次,当其他人对其再次实例化时,便返回第一次实例化的对象.这种模式可以极大地节约资源.典型应用于数据库类的实例化. 以实例化一个Mysql数据库类为例: 要实现一个类只实例 ...

  5. Winform制作圆弧panel

    原理就是手动去画边框留出四个角 然后绘制四张圆弧的图片到panel上 public class ArcPanel : Panel { protected override void OnPaint(P ...

  6. 新项目引入gulp

    1:安装npm:官网下载nodejs--https://nodejs.org/en/.进行安装npm;--http://jingyan.baidu.com/article/a17d528506d7f5 ...

  7. Vue - 使用命令行搭建单页面应用

    使用命令行搭建单页面应用 我们来看一下最后完成的效果: 大纲 1. 下载 node, git, npm 2. 使用命令行安装一个项目 一. 下载工具 node , git  的下载大家可以去官网自行下 ...

  8. 关于JavaScript的小笔记

    1.当 JavaScript 中的变量被声明的时候,程序内部会给它一个初始值 undefined.当你对一个值为 undefined 的变量进行运算操作的时候,算出来的结果将会是 NaN,NaN 的意 ...

  9. Class.forName()

    主要功能 Class.forName(xxx.xx.xx)返回的是一个类 Class.forName(xxx.xx.xx)的作用是要求JVM查找并加载指定的类, 也就是说JVM会执行该类的静态代码段 ...

  10. Linux启动新进程的几种方法及比较[转]

    有时候,我们需要在自己的程序(进程)中启动另一个程序(进程)来帮助我们完成一些工作,那么我们需要怎么才能在自己的进程中启动其他的进程呢?在Linux中提供了不少的方法来实现这一点,下面就来介绍一个这些 ...