DOM Core和HTML DOM的区别
W3C所制订的DOM Level分为两大模块：Core和HTML。
第一个大模块是Core核心，W3C规范是这样描述Core的：满足软件开发者和Web脚本编写者，访问和操控产品项目中包含的可解析的HTML和XML内容。DOM Core，并不专属于JavaScript（如php也支持）。
第二个HTML模块，规范描述为：HTML之中特定元素的功能，和恰到好处的、易用的、针对常见性任务的HTML文档操作机制。HTML模块的意义也在于解决了向后兼容的问题。
DOM（文档对象模型）是由W3C制定的一套访问和操作XML（eXtensible Markup Language）文档的标准，即API。
DOM与特定的平台、浏览器、语言无关，很多种语言都实现了DOM，比如因为JavaScript和PHP都实现了DOM
注意理解：
1、应用标准DOM的思维在于，在节点树之中不含有固定的节点标记，假设所有的标记都是自定义的，而不依赖html结构，通过dom的一些方法和属性来操控文档。
View Code
<note>
<to>George</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don't forget the meeting!</body>
</note>
2、区分CoreAPI和HTMLAPI两者
HTML文档可以使用CoreAPI和HTMLAPI两者；而XML文档只能使用CoreAPI。
DOM Core模块：接口基于节点方式（Node-based）。
DOM1 HTML的模块：接口基于元素方式（Element-based）；
元素方式与节点方式：
例如，要得到id属性的字符串的值是什么
1采用DOM1Core的方式
myElement.attributes["id"].value;//从Node接口提供的属性
等于：
myElement.getAttributes("id");//从Element实现的方法返回
2使用DOM1 HTML方式的话
myElement.id;myElement.id;
3、我们日常工作的时候，跟HTML文档打交道，其实就是属于W3C所规定的DOM Level1HTML模块内的处理工作。HTMLDOM的特性和方法不是标准的DOM实现，是专门针对HTML同时也让一些DOM操作变的更加简便。
有待理解：DOM1Core部分中一切皆是节点，节点以及其接口都可实现在每个对象身上（从继承的角度理解出发），实现了节点接口才可以有节点的属性、方法。——这是我们理解的前提。然后，根据特定的节点类型的不同，其接口的属性和方法都是不同的，视乎DOM对该节点的设计而定。
归纳一下，
不管是DOM Core还是HTML-DOM，我们在使用JavaScript的时候要注意浏览器之间的兼容性，因为不同的浏览器对这两类方法和属性的支持可能不一样，一般推荐使用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
总结/回顾：
DOM 基本方法
直接引用方法：
1、documen.getElementById(id);
2、document.getElementByTagName(tagName);
返回一个数组，包含对这些节点的引用
间接引用节点
3、子节点element.childNode
返回element的所有子节点，通过element.childNodes[i]的方式来调用
Element.firstChild = element.childNodes[0];
Element.lastChild = element.childNodes[element.childNodes.length-1];
4、父节点element.parentNode
5、下一个兄弟节点element.nextSibling;
上一个兄弟节点element.previousSibling;
获得节点信息
6、nodeName属性获得节点名称eg:<a></a>返回”a”; class=”test”返回”test”; 文本节点返回文本内容。
7、nodeType返回节点的类型。元素节点返回1；属性节点返回2；文本节点返回3；
8、nodeValue返回节点的值。元素节点返回null；属性节点返回undefined；文本节点返回文本内容。
9、hasChildNodes()返回布尔值，判断是否含有子节点。
10、tagName属性返回元素的标记名称。等价于nodeName属性
处理属性节点
11、用setAttributeNode()方法给元素节点添加属性。
ElementNode.setAttribute(attributeName,attributeValue); 参数分别为(属性名称，属性值)
12、用getAttribute()方法获得属性值
处理文本节点
13、innerHTML和innerText方法
改变文档的层次结构
14、创建元素节点document.createElement()
15、创建文本节点Document.createTextNode();
//注: document.createTextNode(" ");他不会通过html编码，也就是说这里创建的不是空格，而是字符串
16、添加子节点 appendChild()。parentElement.appendChild(childElement);
17、插入子节点insertBefore()。
appendChild、insertBefore和insertAfter(自定义函数) 的区别
18、使用replaceChild方法取代子结点。parentNode.replaceChild(newNode,oldNode);
19、使用cloneNode方法复制结点 。node.cloneNode(includeChildren); includeChildren为bool，表示是否复制其子结点 。
20、使用removeChild方法删除子结点 。parentNode.removeChild(childNode);
参考文章：
