25-JavaScript高级程序设计-DOM2&3变化

本文链接：https://blog.youkuaiyun.com/dandan666dandan/article/details/95936210

本文主要介绍了DOM2级和3级针对XML命名空间的变化，包括Node、Document、Element、NamedNodeMap等类型的变化，还提及了其他方面的变化，如DocumentType、Document、Node类型的变化以及框架的变化。这些变化旨在扩展DOM API，满足操作XML的需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

DOM1 级主要定义的是 HTML 和 XML 文档的底层结构。DOM2 和 DOM3 级则在这个结构的基础上引入了更多的交互能力，也支持了更高级的 XML 特性。

一、DOM变化

DOM2 级和 3 级的目的在于扩展 DOM API，以满足操作 XML 的所有需求，同时提供更好的错误处理及特性检测能力。
“DOM2 级核心”没有引入新类型，它只是在 DOM1 级的基础上通过增加新方法和新属性来增强了既有类型。“DOM3 级核心”同样增强了既有类型，但也引入了一些新类型。

1. 针对XML命名空间的变化

有了 XML 命名空间，不同 XML 文档的元素就可以混合在一起，共同构成格式良好的文档，而不必担心发生命名冲突。
从技术上说，HTML 不支持 XML 命名空间，但 XHTML 支持 XML 命名空间。
命名空间要使用 xmlns 特性来指定。

在只基于一种语言编写 XML 文档的情况下，命名空间实际上也没有什么用。在混合使用两种语言的情况下，命名空间的用处就非常大。
例如：混合 XHTML 和 SVG 语言的文档，从技术上说是一个 XHTML 文档，但因为有了命名空间，其中的 SVG 代码也仍然是有效的。

Node 类型的变化

在 DOM2 级中，Node 类型包含下列特定于命名空间的属性：

localName：不带命名空间前缀的节点名称。
namespaceURI：命名空间URI或者null(在未指定的情况下)。
prefix：命名空间前缀或者null(在未指定的情况下)。
当节点使用了命名空间前缀时，其 nodeName 等于 prefix+":"+ localName。

DOM3 级在此基础上更进一步，又引入了下列与命名空间有关的方法：

isDefaultNamespace(namespaceURI)：在指定的 namespaceURI 是当前节点的默认命名空间的情况下返回 true。
lookupNamespaceURI(prefix)：返回给定 prefix 的命名空间。
lookupPrefix(namespaceURI)：返回给定 namespaceURI 的前缀。

Document 类型的变化

DOM2 级中的 Document 类型也发生了变化，包含了下列与命名空间有关的方法：

createElementNS(namespaceURI, tagName)：使用给定的 tagName，创建一个属于命名空间 namespaceURI 的新元素。
createAttributeNS(namespaceURI, attributeName)：使用给定的 attributeName，创建一个属于命名空间 namespaceURI 的新特性。
getElementsByTagNameNS(namespaceURI, tagName)：返回属于命名空间 namespaceURI 的 tagName 元素的 NodeList。

Element 类型的变化

“DOM2 级核心” 中有关 Element 的变化，主要涉及操作特性。新增的方法如下：

getAttributeNS(namespaceURI,localName)：取得属于命名空间 namespaceURI 且名为 localName 的特性。
getAttributeNodeNS(namespaceURI,localName)：取得属于命名空间 namespaceURI 且名为 localName 的特性节点。
getElementsByTagNameNS(namespaceURI, tagName)：返回属于命名空间 namespaceURI 的 tagName 元素的 NodeList。
hasAttributeNS(namespaceURI,localName)：确定当前元素是否有一个名为 localName 的特性，而且该特性的命名空间是 namespaceURI。
注意，“DOM2 级核心”也增加了一个 hasAttribute()方法，用于不考虑命名空间的情况。
removeAttriubteNS(namespaceURI,localName)：删除属于命名空间 namespaceURI 且名为 localName 的特性。
setAttributeNS(namespaceURI,qualifiedName,value)：设置属于命名空间 namespace- URI 且名为 qualifiedName 的特性的值为 value。
setAttributeNodeNS(attNode)：设置属于命名空间 namespaceURI 的特性节点。

NamedNodeMap 类型的变化

NamedNodeMap 类型也新增了下列与命名空间有关的方法。
由于特性是通过 NamedNodeMap 表示的，因此这些方法多数情况下只针对特性使用。

getNamedItemNS(namespaceURI,localName)：取得属于命名空间 namespaceURI 且名为localName 的项。
removeNamedItemNS(namespaceURI,localName)：移除属于命名空间 namespaceURI 且名为 localName 的项。
setNamedItemNS(node)：添加 node，这个节点已经事先指定了命名空间信息。

由于一般都是通过元素访问特性，所以这些方法很少使用。

2. 其他方面的变化

DocumentType 类型的变化

DocumentType 类型新增了 3 个属性：publicId、systemId 和 internalSubset。
publicId、systemId：表示的是文档类型声明中的两个信息段。
internalSubset：用于访问包含在文档类型声明中的额外定义。

Document 类型的变化

importNode(要复制的节点，一个表示是否复制子节点的布尔值)：从一个文档中取得一个节点，然后将其导入到另一个文档，使其成为这个文档结构的一部分。
注意：每个节点都有一个 ownerDocument 属性，表示所属的文档。
importNode 返回的结果是原来节点的副本，但能够在当前文档中使用。（appendChild 方法传入节点不能属于其他文档）
var newNode = document.importNode(oldNode, true); //导入节点及其所有子节点
HTML 文档中并不常用，在 XML 文档中用得比较多。

defaultView 属性：保存着一个指针，指向拥有给定文档的窗口(或框架)。
var parentWindow = document.defaultView || document.parentWindow;
除 IE 之外的所有浏览器都支持 defaultView 属性。在 IE 中有一个等价的属性名叫 parentWindow(Opera 也支持这个属性)。

document.implementation 对象新方法：
createDocumentType(文档类型名称，publicId，systemId)：创建一个新的 DocumentType 节点
createDocument(针对文档中元素的 namespaceURI，文档元素的标签名，新文档的文档类型)：创建新文档
createHTMLDocument(新创建文档的标题)：创建一个完整的 HTML 文档，包括<html>、<head>、<title>和 <body>元素。返回新的 HTML 文档

Node 类型的变化

isSupported(特性名，特性版本号)：确定当前节点具有什么能力
类似 hasFeature()，也存在与 hasFeature() 方法相同的问题：不同实现在决定对什么特性返回 true 或 false 时并不一致
–> 最好还是使用能力检测。

两个辅助比较节点的方法：
isSameNode(节点)：判断两个节点引用的是同一个对象。
isEqualNode(节点)：判断两个节点是相同的类型，具有相等的属性（nodeName、nodeValue等），attributes 和 childNodes 属性相等（相同位置包含相同的值）。

DOM 节点添加额外数据的新方法：
setUserData(要设置的键，实际的数据，处理函数)：将数据指定给节点
getUserData()：获取设置数据
处理函数：
在带有数据的节点被复制、删除、重命名、引入一个文档时调用。
5 个参数：表示操作类型的数值(1-复制 2-导入 3-删除 4-重命名)、数据键、数据值、源节点和目标节点。
在删除节点时，源节点是 null；除在复制节点时，目标节点均为 null。
在函数内部，可以决定如何存储数据。

框架的变化

框架和内嵌框架分别用 HTMLFrameElement 和 HTMLIFrameElement 表示，它们在 DOM2 级中都有了一个新属性，名叫 contentDocument。这个属性包含一个指针，指向表示框架内容的文档对象。
var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
contentDocument 属性是 Document 类型的实例，可以像使用其他 HTML 文档一样使用，包括所有属性和方法。
contentDocument 浏览器支持：Opera、Firefox、Safari 和 Chrome，所有浏览器都支持 contentWindow 属性。

写在后面：本篇涉及的DOM变化，大多数平时用的不多，有使用疑问的，建议参考红宝书原文，尤其是文中的一些示例。

上一篇：24-JavaScript高级程序设计-DOM扩展
下一篇：26-JavaScript高级程序设计-DOM2&3样式