DOM1主要定义了HTML和XML文档的底层结构。DOM2和DOM3在这些结构上加入更多的是交互能力，提供了更高级的XML特性。
DOM的演进
DOM2和DOM3模块的目标是扩展API，满足XML的所有需求并提供更好的错误处理和特性检测。DOM2 Core没有新增任何类型，增加了一些方法属性，DOM3 Core除了增强原有类型，也新增了类型。
1.XML命名空间
最开始看书这里没有看懂，实际上，XML命名是提供了避免元素命名冲突的办法。
举个
XML中，元素的名称是开发者自己指定的，如果有一天卧龙和凤雏一起开发，当两个不同的文档使用相同的元素名时，就会发生命名冲突。
这个 XML 携带 HTML 表格的信息：
<table>
<tr>
<td>Apples</td>
<td>Bananas</td>
</tr>
</table>
这个 XML 文档携带有关桌子的信息（一件家具）：
<table>
<name>African Coffee Table</name>
<width>80</width>
<length>120</length>
</table>
假如这两个 XML 文档被一起使用，由于两个文档都包含带有不同内容和定义的 <table> 元素，就会发生命名冲突。
XML 解析器无法确定如何处理这类冲突。
👆的问题可以通过前缀名来解决
<h:table>
<h:tr>
<h:td>Apples</h:td>
<h:td>Bananas</h:td>
</h:tr>
</h:table>
<f:table>
<f:name>African Coffee Table</f:name>
<f:width>80</f:width>
<f:length>120</f:length>
</f:table>
但使用前缀名前，一个所谓的用于前缀的命名空间必须被定义。
命名空间是在元素的开始标签的 xmlns 属性中定义的。
命名空间声明的语法如下。xmlns:前缀="URI"。
<root>
<h:table xmlns:h="http://www.w3.org/TR/html4/">
<h:tr>
<h:td>Apples</h:td>
<h:td>Bananas</h:td>
</h:tr>
</h:table>
<f:table xmlns:f="http://www.w3cschool.cc/furniture">
<f:name>African Coffee Table</f:name>
<f:width>80</f:width>
<f:length>120</f:length>
</f:table>
</root>
在上面的实例中，<table> 标签的 xmlns 属性定义了 h: 和 f: 前缀的合格命名空间。
当命名空间被定义在元素的开始标签中时，所有带有相同前缀的子元素都会与同一个命名空间相关联。
命名空间，可以在他们被使用的元素中或者在 XML 根元素中声明：
<root xmlns:h="http://www.w3.org/TR/html4/"
xmlns:f="http://www.w3cschool.cc/furniture">
<h:table>
<h:tr>
<h:td>Apples</h:td>
<h:td>Bananas</h:td>
</h:tr>
</h:table>
<f:table>
<f:name>African Coffee Table</f:name>
<f:width>80</f:width>
<f:length>120</f:length>
</f:table>
</root>
注释：命名空间 URI 不会被解析器用于查找信息。
其目的是赋予命名空间一个惟一的名称。不过，很多公司常常会作为指针来使用命名空间指向实际存在的网页，这个网页包含关于命名空间的信息。
并且当文档中混合使用多种XML语言时更有必要，比如当文档中使用了XHTML和SVG两种语言👇
这个栗子中，通过给<svg>元素设置自己的命名空间，将其标识为当前文档的外来元素。虽然这是XHTML文档，但是其中的svg代码依然有效。
这里先写到这些基础的部分，如果后续遇到哪里有麻烦就回来继续添加。
样式
HTML中样式有3种定义方式：外部样式表（通过<link>元素）、文档样式表（使用<style>元素）和元素特定样式（使用style属性）。HTML style属性中，CSS属性在JavaScript style对象中都有对应的属性。
任何时候，只要获得了有效DOM元素的引用，就可以通过JavaScript来设置样式👇
let myDiv = getDocumentById("myDiv");
myDiv.style.backgroundColor = "red";
有两点需要注意👇
①CSS中的float不可以直接转换，因为float是JavaScript的保留字，要用cssFloat。
②👆的栗子中background-color要换成backgroundColor，不支持连字符。
不仅可以通过操作DOM设置更改，也可以获取样式👇
console.log(myDiv.style.backgroundColor);//red
遍历
DOM2 Traversal and Range模块定义了两个类型用于辅助顺序遍历DOM结构。这两个类型——NodeIterator和TreeWalker——从某个起点开始执行对DOM结构的深度优先遍历。
更多看📕P478
文章内容参考：JavaScript高级程序设计（第四版）标题样式来自：juejin.cn/post/684490…
哪里写错了就联系我🐧：54269504
