`
orange.lpai
  • 浏览: 92765 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

DOM树的结构(转)

阅读更多
一.引言
XML是EXtensible Markup Language的缩写,它是一种可扩展性标识语言, 能够让你自己创造标识,标识你所表示的内容。DOM全称是Document Object Model(文档对象模型),定义了一组与平台和语言无关的接口,以便程序和脚本能够动态访问和修改XML文档内容、结构及样式。XML创建了标识,而 DOM的作用就是告诉程序如何操作和显示这些标识。
二.DOM树结构
实际上XML将数据组织成为一棵树,DOM通过解析XML文档,为XML文档在逻辑上建立一个树模型,树的节点是一个个的对象。这样通过操作这棵树和这些对象就可以完成对XML文档的操作,为处理文档的所有方面提供了一个完美的概念性框架。
如下XML文档:
<line id=”1”> the <bold>First</bold>line</line>
DOM的结构表示如下:




由于DOM“一切都是节点(everything-is-a-node)”,XML树的每个 Document、Element、Text 、Attr和Comment都是 DOM Node。
由上面例子可知, DOM 实质上是一些节点的集合。由于文档中可能包含有不同类型的信息,所以定义了几种不同类型的节点,如:Document、Element、Text、 Attr 、CDATASection、ProcessingInstruction、Notation 、EntityReference、Entity、DocumentType、DocumentFragment等。
在创建XML文件时,如定义如下的XML文档:
<?xml version="1.0" encoding="UTF-8"?>
<students>
<!--this is an example-->
<student>
<name>
<first-name>Mike</first-name>
<last-name>Silver</last-name>
</name>
<sex>male</sex>
<class studentid="15">98211</class>
<birthday>
<day>3</day>
<month>3</month>
<year>1979</year>
</birthday>
</student>
<student>
<name>
<first-name>Ben</first-name>
<last-name>Silver</last-name>
</name>
<sex>male</sex>
<class studentid="16">98211</class>
<birthday>
<day>3</day>
<month>3</month>
<year>1980</year>
</birthday>
</student>
</students>

我们很自然想象到能得到如下图的结构,但是这只是数据的描述,而不是DOM树的结构。


我们可以通过以下的代码得到上面的XML文档的根结点和根结点下孩子节点的数目。
import javax.xml.parsers.*;
import org.w3c.dom.*;
import java.io.File;
import xmlwriter.XMLProperties;
public class Xml
{
public static void main(String args[])
{ try
{ File file=new File("links.xml");
DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance();
DocumentBuilder builder=factory.newDocumentBuilder();
Document doc=builder.parse(file);
doc.normalize();
Element theRoot = doc.getDocumentElement();
NodeList theList=theRoot.getChildNodes();
System.out.println("the students root has "+theList.getLength()+" children");
}
}
}



结果显示为:

但是从上面XML文档可以看出,students一共只有3个孩子节点(包括注释),但程序得到的结果确实有7个孩子结点。为什么呢?因为在DOM中节点 和元素不是等价的,它的7个节点包括:两个student元素、注释及它们周围的文本节点。这些文本节点有可能是回车换行、空格或者退格,假如把这些回车 换行、空格和退格都删除,那么DOM解释的时候就没有这些文本节点,孩子节点就真的只有3个了。下图是DOM树的精确描述:




三.常见的基本节点类型:文档、元素、属性、文本和注释
XML 中共有12种节点类型,其中最常见的节点类型有5种:
元素:元素是 XML 的基本组成单元。,描述XML的基本信息。
属性:属性节点包含关于元素节点的信息,通常包含在元素里面,描述元素的属性。
文本:包含许多文本信息或者只是空白。
文档:文档节点是整个文档中所有其它节点的父节点。
注释:注释是对相关的信息进行描述、注释。
四.常见的基本方法:
通过Jaxp包来解释XML文档后,对DOM的节点对象的基本操作有:
appendChild(Node newChild):在本节点上增加一个新的孩子到孩子列表的后面。
getAttributes():得到本节点的属性列表,返回类型为NamedNodeMap。
getChildNodes():得到本节点的孩子列表,返回类型为NodeList。
getFirstChild()、getLastChild():得到第一个和最后一个孩子节点。
getNextSibling()、getPreviousSibling():得到本节点的下一个和前一个兄弟节点。
getNodeName()、getNodeType()、getNodeValue():得到本节点的名称、类型和值。
getParentNode():得到本节点的父亲节点。
insertBefore(Node newChild, Node refChild):在本节点的refChild孩子节点前插入一个新的节点。
removeChild(Node oldChild):删除oldChild孩子节点。
以上列出对DOM树操作的一些常用的基本的方法,还有很多其他的方法,读者可以参考有关的规范。
五.递归遍历DOM树
DOM树结构和二叉树很相似,元素的孩子节点集合就是该元素的分支,但是属性节点不是元素的子节点,它只是描述该元素节点的一些性质而已,属于元素节点结构内部的一部分。以下是用java编写的一段遍历DOM的程序:
public class RecurDOM(NodeList nodelist)
{
Node node;
int i;
if(nodelist.getLength() == 0)
{
// 该节点没有子节点返回
return;
}
for(i=0;i<nodelist.getLength();i++)
{
node = nodelist.item(i);
if(node.getNodeType() == Node.ELEMENT_NODE)
RecurDOM(node.getChildNodes());//递归调用
}
}

六.小结:
DOM是一种在浏览器内编程的模型,同时也是XML的主要接口,它与语言和平台无关,它是基于树的 API,它把所有的数据以父子的节点层次结构装入内存构成一棵树,这些节点的类型可以是元素、文本、属性、注释或其它。它允许开发者读取、创建、删除和编 辑 XML 数据。在这再次强调,DOM的“一切都是节点(everything-is-a-node)”。
本文的程序是用java编写的,使用Jaxp包来解释XML文档。本文的适用对象是理解 XML 基本概念并开始准备用DOM编写应用程序来操纵 XML文档 的开发者。
           
                        转自:http://hi.baidu.com/binghong_2008/blog

           
  • 大小: 15.7 KB
  • 大小: 15.4 KB
  • 大小: 1.5 KB
  • 大小: 42.8 KB
分享到:
评论

相关推荐

    使用递归和dom遍历dom树形结构

    在DOM树的情况下,递归非常适合用来遍历整个树结构,因为它可以深入到树的每一层,确保每个节点都被访问。 #### Java实现示例 以下是一个使用递归和DOM来遍历XML文档的Java代码示例: ```java package ...

    c++ html dom 树

    在这个项目中,开发者使用C++实现了一个DOM树,允许对HTML文档进行半结构化的处理。下面我们将深入探讨这个主题。 首先,C++ HTML DOM树是通过解析HTML源代码来创建的一个数据结构,它以树的形式表示了HTML文档的...

    C#获取HTML源码及生成DOM树

    一旦有了DOM树,就可以方便地进行各种网页解析任务,如查找特定元素、提取数据或修改内容。例如,要找到页面上的所有链接,可以这样做: ```csharp public List&lt;string&gt; ExtractLinks(HtmlDocument dom) { var ...

    论文研究-基于DOM树结构的Blog网页自动识别.pdf

    针对当前Internet中大量出现的博客网页,通过分析博客网页自身的结构特点和技术特征,结合网页的DOM节点特性,提出了基于DOM树分析和模式匹配的博客网页自动识别算法,并通过实验对本算法进行了验证,指出需进一步...

    dom树的结构.doc

    DOM(文档对象模型)是XML和HTML文档的一种标准表示方式,它将文档解析为一个可操作的树形结构,使得程序可以便捷地访问和修改文档的内容、结构和...理解DOM树的结构和节点类型对于有效地处理和解析XML文档至关重要。

    XML应用开发(软件品牌)-1期 6.1 课堂实践-DOM树结构.doc

    在这个“XML应用开发”的课程中,我们专注于理解DOM树结构及其实践应用。 DOM树结构是解析XML文档的核心概念,它将XML文档视为一个由节点组成的树。在DOM中,每个XML元素、属性、文本、注释等都有对应的节点类型。...

    分析dom树与获取信息

    开发EPC编辑工具必备源码,dom树的分析、获取xml是信息与处理源码,绝对正宗,本人实验室真品

    根据DOM将html转为canvas图片格式

    DOM是HTML和XML文档的结构化表示,它将文档解析为树形结构,允许开发者通过JavaScript或其他编程语言与文档的各个元素交互。在这个场景中,DOM被用来获取HTML页面的所有内容。 2. Canvas API: HTML5引入的Canvas...

    DOM.rar_DOM_HTML dom_dom树解析

    在HTML DOM中,每个HTML元素都是一个对象,这些对象形成了一个层次结构,即DOM树。**DOM树解析**是将HTML或XML文档转换成这个树状结构的过程。解析器会逐行读取文档,创建相应的节点,并根据元素的嵌套关系构建树形...

    XML应用开发(软件品牌)-1期 6.1 案例分析-DOM树结构.doc

    以`6.1-books.xml`为例,其DOM树结构如下: - 文档节点 - 元素节点:bookstore - 元素节点:book (category=CHILDREN) - 属性节点:category - 元素节点:title (lang=en) - 文本节点:Harry Potter - 元素...

    22-DOM树:JavaScript是如何影响DOM树构建的?_For_vip_user_0011

    总结来说,DOM树的构建是浏览器解析HTML文件的关键步骤,JavaScript的执行会中断这一过程,以允许动态更新DOM结构。了解这一机制对于优化网页性能至关重要,因为延迟JavaScript执行或使用异步加载可以减少阻塞,加快...

    DOM和BOM的使用

    DOM 树是指文档对象模型的树形结构,每个节点都是一个对象,节点之间通过父子关系连接。DOM 树提供了许多方法和属性,开发者可以通过这些方法和属性来操作文档的内容和结构。 节点树 节点树是指 DOM 树中的一个...

    计算机应用技术第6章-DOM编程.pptx

    通过学习本章节,读者可以了解DOM模型的基本概念、DOM树结构的生成过程、DOM模型的相关概念、DOM标准接口的使用等。 一、DOM基本概念 文档对象模型(Document Object Model,DOM)是一种应用程序接口(API),它将...

    基于DOM树序列值比对的SQL注入漏洞检测.pdf

    本文提出了一种新的SQL注入漏洞检测算法,它基于DOM树结构的变化来检测SQL注入。DOM树是页面元素结构的树状表示,页面注入前后DOM树的结构会有所变化。通过比较这些变化,可以发现注入漏洞。具体步骤包括: - 选取...

    javascript先序遍历DOM树的方法

    DOM树由文档中的所有节点(元素节点、文本节点、注释节点等)所构成的一个树结构,DOM树的解析和构建是浏览器要实现的关键功能。既然DOM树是一个树结构,那么我们就可以使用遍历树结构的相关方法来对DOM树进行遍历,...

    c#使用HtmlParser建立文档树 DomTree

    接下来,让我们看看如何使用HtmlParser构建DOM树: ```csharp using HtmlAgilityPack; // 引用HtmlAgilityPack库,HtmlParser是其中的一部分 string htmlContent = @"&lt;html&gt;&lt;body&gt;&lt;h1&gt;Hello, World!&lt;/h1&gt;&lt;/body&gt;...

    用vnode描述一个DOM的结构.docx

    5. **渲染与更新**:Vue的`render`函数调用`_c`和`vnode`生成VNode树,然后通过Diff算法找出旧VNode树和新VNode树之间的差异,最小化DOM操作,最终更新实际的DOM结构。 这个过程极大地提高了Vue应用程序的性能,...

Global site tag (gtag.js) - Google Analytics