区别：DOM Core 与 HTML-DOM

今天在看JS DOM编程艺术的时候看到 DOM Core 和 HTML-DOM这2个名词，遂上网查询了下，帮助记录和理解；

 

 

DOM（文档对象模型）是由W3C制定的一套访问和操作XML（eXtensible Markup Language）文档的标准，即API。比如DOM告诉JavaScript引擎如何在浏览器窗口中显示和操作XML创建的标记（Tag）。

DOM与特定的平台、浏览器、语言无关，很多种语言都实现了DOM，比如因为JavaScript和PHP都实现了DOM，所以 JavaScript中有getElementsByTagName()方法，PHP中也有 getElementsByTagName()，getElementsByTagName()方法是DOM规定的访问XML文档的接口。

XML与HTML相似，但两者是有区别。XML和HTML都来自于SGML，它们都含有标记，有着相似的语法，HTML和XML的最大区别在 于：HTML是一个定型的标记语言，用固定的标记来描述和显示数据，比如
<h1>表示首行标题，有固定的尺寸；而XML没有固定的标记，只能通过自定义的标记来描述数据的形式和结构，而不能显示。HTML是将数据 和显示混在一起，而XML则是将数据和显示分开来。那为什么能使用DOM访问和操作HTML文档（即网页）呢？Web语义化的一个发展方向是将HTML逐 渐演变为更有语义、能将数据内容与现实分离的XML，但HTML不可能立即演变为XML，目前推荐使用的是一个过渡产物——XHTML。HTML与 XHTML网页形成的节点树（统称为HTML节点树）在结构上与XML节点树一样，可以看做是一个符合DOM的XML文档，因此可以使用实现了DOM的程 序语言（如JavaScript、PHP等）来访问和操作HTML文档，即访问和操作那些节点。

由于HTML与XML的相似性及差异，JavaScript不仅实现了标准的DOM方法和属性（即由W3C制定的），而且还实现了HTML特有的 DOM方法和属性，前者称为DOM Core，并不专属于JavaScript，后者称为HTML-DOM。不管是DOM Core还是HTML-DOM，我们在使用JavaScript的时候要注意浏览器之间的兼容性，因为不同的浏览器对这两类方法和属性的支持可能不一样。 这里不详谈DOM Core和HTML-DOM，以及跨浏览器兼容性，教材上都有详细描述。但一般推荐使用DOM Core方法和属性，尽管稍显繁杂。

常见的Core DOM方法如下：

1、创建节点
createElement()
createTextNode()
2、复制节点
cloneNode()
3、插入节点
appendChild()
insertBefore()
4、删除节点
removeChild()
5、替换节点
replaceChild()
6、查找和设置节点属性
setAttribute()
getAttribute()
7、查找节点
getElementById()
getElementsByTagName()
hasChildNode()

常见的Core DOM属性如下：

node.childNodes
node.firstChild
node.lastChild
node.nextSibling
node.previousSibling
node.parentNode