在DOM眼中，HTML跟XML一样是一种树形结构的文档，<html>是根（root）节点，<head>、<title>、<body>是<html>的子（children）节点，互相之间是兄弟（sibling）节点；<body>下面才是子节点<table>、<span>、<p>等等。如下图：
HTML文档结构.jpg
这个是不是跟XML的结构有点相似呢。不同的是，HTML文档的树形主要包含表示元素、标记的节点和表示文本串的节点。
HTML文档的节点
DOM下，HTML文档各个节点被视为各种类型的Node对象。每个Node对象都有自己的属性和方法，利用这些属性和方法可以遍历整个文档树。由于HTML文档的复杂性，DOM定义了nodeType来表示节点的类型。这里列出Node常用的几种节点类型：
接口 nodeType常量 nodeType值 备注
Element Node.ELEMENT_NODE 1 元素节点
Text Node.TEXT_NODE 3 文本节点
Document Node.DOCUMENT_NODE 9 document
Comment Node.COMMENT_NODE 8 注释的文本
DocumentFragment Node.DOCUMENT_FRAGMENT_NODE 11 document片断
Attr Node.ATTRIBUTE_NODE 2 节点属性
DOM树的根节点是个Document对象，该对象的documentElement属性引用表示文档根元素的Element对象（对于HTML文档，这个就是<html>标记）。Javascript操作HTML文档的时候，document即指向整个文档，<body>、<table>等节点类型即为Element。Comment类型的节点则是指文档的注释。具体节点类型的含义，请参考《Javascript权威指南》，在此不赘述。
Document定义的方法大多数是生产型方法，主要用于创建可以插入文档中的各种类型的节点。常用的Document方法有：
方法 描述
createAttribute() 用指定的名字创建新的Attr节点。
createComment() 用指定的字符串创建新的Comment节点。
createElement() 用指定的标记名创建新的Element节点。
createTextNode() 用指定的文本创建新的TextNode节点。
getElementById() 返回文档中具有指定id属性的Element节点。
getElementsByTagName() 返回文档中具有指定标记名的所有Element节点。
对于Element节点，可以通过调用getAttribute()、setAttribute()、removeAttribute()方法来查询、设置或者删除一个Element节点的性质，比如<table>标记的border属性。下面列出Element常用的属性：
tagName
元素的标记名称，比如<p>元素为P。HTML文档返回的tabName均为大写。
Element常用的方法：
方法
描述
getAttribute()
以字符串形式返回指定属性的值。
getAttributeNode()
以Attr节点的形式返回指定属性的值。
getElementsByTabName()
返回一个Node数组，包含具有指定标记名的所有Element节点的子孙节点，其顺序为在文档中出现的顺序。
hasAttribute()
如果该元素具有指定名字的属性，则返回true。
removeAttribute()
从元素中删除指定的属性。
removeAttributeNode()
从元素的属性列表中删除指定的Attr节点。
setAttribute()
把指定的属性设置为指定的字符串值，如果该属性不存在则添加一个新属性。
setAttributeNode()
把指定的Attr节点添加到该元素的属性列表中。
Attr对象代表文档元素的属性，有name、value等属性，可以通过Node接口的attributes属性或者调用Element接口的getAttributeNode()方法来获取。不过，在大多数情况下，使用Element元素属性的最简单方法是getAttribute()和setAttribute()两个方法，而不是Attr对象。
使用DOM操作HTML文档
Node对象定义了一系列属性和方法，来方便遍历整个文档。用parentNode属性和childNodes[]数组可以在文档树中上下移动；通过遍历childNodes[]数组或者使用firstChild和nextSibling属性进行循环操作，也可以使用lastChild和previousSibling进行逆向循环操作，也可以枚举指定节点的子节点。而调用appendChild()、insertBefore()、removeChild()、replaceChild()方法可以改变一个节点的子节点从而改变文档树。
需要指出的是，childNodes[]的值实际上是一个NodeList对象。因此，可以通过遍历childNodes[]数组的每个元素，来枚举一个给定节点的所有子节点；通过递归，可以枚举树中的所有节点。下表列出了Node对象的一些常用属性和方法：
Node对象常用属性：
attributes
如果该节点是一个Element，则以NamedNodeMap形式返回该元素的属性。
childNodes
以Node[]的形式存放当前节点的子节点。如果没有子节点，则返回空数组。
firstChild
以Node的形式返回当前节点的第一个子节点。如果没有子节点，则为null。
lastChild
以Node的形式返回当前节点的最后一个子节点。如果没有子节点，则为null。
nextSibling
以Node的形式返回当前节点的兄弟下一个节点。如果没有这样的节点，则返回null。
nodeName
节点的名字，Element节点则代表Element的标记名称。
nodeType
代表节点的类型。
parentNode
以Node的形式返回当前节点的父节点。如果没有父节点，则为null。
previousSibling
以Node的形式返回紧挨当前节点、位于它之前的兄弟节点。如果没有这样的节点，则返回null。
Node对象常用方法：
appendChild()
通过把一个节点增加到当前节点的childNodes[]组，给文档树增加节点。
cloneNode()
复制当前节点，或者复制当前节点以及它的所有子孙节点。
hasChildNodes()
如果当前节点拥有子节点，则将返回true。
insertBefore()
给文档树插入一个节点，位置在当前节点的指定子节点之前。如果该节点已经存在，则删除之再插入到它的位置。
removeChild()
从文档树中删除并返回指定的子节点。
replaceChild()
从文档树中删除并返回指定的子节点，用另一个节点替换它。
分享到：
相关推荐
W3C API通常指符合W3C标准的Web API，这些API是构建Web应用程序的基础，包括DOM（文档对象模型）、XMLHttpRequest、Fetch API等用于处理网页内容和与服务器通信的方法。 1. **DOM（Document Object Model）**：DOM...
本手册是一份针对W3C DOM（文档对象模型）模型的详尽参考指南，重点介绍了Gecko引擎所支持的DOM API特性。这份资料最初来自Mozilla开发网站，但由于各种原因，Mozilla已不再提供其下载链接。因此，这份文档对于那些...
【标题】"java中文API和W3CAPI" 涵盖了编程语言和技术标准的重要参考资料，主要包括Java、JavaScript、XML、CSS以及HTML的API文档。这些API是开发者日常工作中不可或缺的工具，提供了详细的类库函数说明，帮助程序员...
W3C的官方API文档为开发者提供了权威的参考资源，详尽解释了各种标准的使用方法和行为，有助于确保代码的兼容性和可维护性。 CHM（Compiled Help Manual）是微软的一种帮助文件格式，它将HTML文档和其他资源打包成...
org.dom4j.dom An implementation of the dom4j API which also supports the W3C object model. org.dom4j.dtd Classes to represent the DTD declarations. org.dom4j.io Provides input and output via SAX and ...
**标题解析：**"dedom" 是一个项目或者库的名称，它专注于 W3C DOM API 的实现，特别是在 HTML5 的解析器和序列化器上。"W3C DOM API" 是 Web 开发中用于处理文档对象模型（Document Object Model）的标准接口，它...
2. **API接口**：DOM API是原生JavaScript对象和方法，操作相对复杂，而jQuery提供了一致、友好的API，简化了DOM操作。 3. **兼容性**：jQuery处理了不同浏览器之间的差异，提供了跨浏览器的解决方案，而W3C DOM在...
总之，掌握DOM是成为熟练Web开发者的必备技能，W3C的DOM手册是学习和查询DOM知识的重要参考资料，无论在线还是离线，都能提供强大的支持。通过深入学习和实践，开发者能够更好地理解和控制网页的动态行为，提升开发...
2. **XML文档对象模型（DOM）**：DOM是一种W3C标准，将XML文档转换为一个树形结构，允许开发者通过节点操作来访问和修改XML内容。DOM4J虽然名字中有"DOM"，但它并不是DOM标准的实现，而是提供了一种更轻量级、更高效...
离线版本的**JQuery API**和**W3School**教程，对于没有网络或者需要离线学习的开发者来说非常有用。它们包含完整的函数和方法文档，以及示例代码，可以帮助开发者快速查询和理解相关知识，提高开发效率。
W3C的DOM API是Web开发的核心，它定义了一种标准，使得通过脚本或程序可以访问和操作HTML和XML文档的结构、内容和样式。DOM提供了添加、删除和修改网页元素的方法，使得动态更新页面变得简单易行。 PHP作为服务器端...
7. **转换功能**：DOM4J可以将XML文档转换成其他格式，如HTML、JDOM、W3C DOM或者直接转换为字符串。 8. **性能优化**：DOM4J在设计时考虑了性能，比如使用缓冲和池化技术来减少内存消耗和提高效率。 提供的.chm和...
为了更好地应用这些API，熟悉W3C规范和浏览器兼容性表是必要的，因为并非所有特性在所有浏览器中都得到支持。开发者通常需要借助像jQuery这样的库来实现跨浏览器兼容性，但随着现代浏览器的进步，原生DOM API的使用...
DOM是W3C制定的一种标准，它将文档结构表示为一棵树形模型，每个节点代表文档的一部分，允许程序员通过编程方式对文档内容进行增、删、改、查。 DOM操作的核心在于解析和构建XML或HTML文档。在易语言中，我们可以...
libRange 在 IE 8 及更早版本上模拟 W3C DOM Range API。 它基于 TinyMCE 的相同代码，但仅依赖于 jQuery（轻微）和 AMD 实现。 libRange 还有一些在处理文本时很有用的实用方法，以及一些选择和范围记录方法。 ...
DOM，全称为Document Object Model，中文译为文档对象模型，是W3C组织制定的一个标准，用于表示XML或HTML文档的一种结构化表示方式。DOM将整个文档视为一个由节点组成的树形结构，其中每个节点代表文档的一部分，如...
DOM（Document Object Model）是一种基于XML和HTML的文档对象模型，它是W3C的一个标准，用于处理和操作XML文档。DOM将XML文档结构化为一个树形结构，每个节点代表XML文档的一部分，允许开发者通过编程方式访问和修改...
W3C DOM是万维网联盟制定的一种文档对象模型，它定义了接口的标准，允许访问和操作文档的内容、结构和样式。通过这种方式，我们可以动态地创建、修改和删除页面的元素和属性。 文档对象模型（Document Object Model...
- **标准性：** 由 W3C 维护的标准，确保不同平台之间的互操作性。 - **灵活性：** 提供了一种结构化的方式来处理文档，支持文档的动态修改。 - **兼容性：** 能够处理不同类型的文档，包括 XML 和 HTML。 - **...