1. createElement

通过 document.createElement([标签名]) 创建元素对象

var p = document.createElement('p');

2. appendChild

[container].appendChild([newNode]) 把一个节点插入到指定容器的末尾，返回新增节点。

添加节点后，其他关系指针会有相应的更新。

var returnNode = someNode.appendChild(newNode);

如果传入到 appendChild() 中的节点已经是文档中的一部分了，那结果就是将该节点从原来位置转移到新位置。即使可以将 DOM 树看成是一系列关系指针连接起来的，但任何 DOM 节点也不能同时出现在文档中的多个位置上。

//=> 从首节点变为尾节点
var returnNode = someNode.appendChild(someNode.firstChild);
returnNode === someNode.lastChild; //=> true

3. insertBefore

[container].insertBefore([newNode], [oldNode])把一个节点插入到容器的指定节点之前，称为指定节点的前一个兄弟节点，返回新增节点。

如果指定节点为 null，则与 appendChild 执行相同操作

//=> 插入成为最后一个子节点
returnNode = someNode.insertBefore(newNode, null);
newNode === someNode.lastChild; //=> true
// 插入成为第一个子节点
returnNode = someNode.insertBefore(newNode, someNode.firstChild);

4. removeChild

[container].removeChild([curNode]) 在指定容器中，删除某一个节点，返回被删除的节点。

returnNode = someNode.removeChild(someNode.firstNode);

5. replaceChild

[container].replaceChild([newNode], [oldNode]) 在指定容器中，使用一个节点替换另一个节点。返回被替换掉的节点。

returnNode = someNode.replace(newNode, someNode.firstChild);

在使用 replaceChild 插入节点时，该节点的所有关系指针都会从被他替换的节点复制过来。

尽管从技术上将，被替换节点仍然还在文档中，但它在文档中已经没有自己的位置了。

6. cloneNode

把某一个节点进行克隆

[cueELe].cloneNode() ：浅克隆，只克隆当前节点，包括样式、属性等

[cueELe].cloneNode(true)：深克隆，当前节点及其里面的整个子节点树都一起克隆

var newA = document.createElement('a');
newA.innerText = '我是A';
//=> 浅克隆
var cloneA = newA.cloneNode();
document.body.appendChild(cloneA); //=><a></a>
//=> 深克隆
var cloneB = newA.cloneNode(true);
document.body.appendChild(cloneB); //=><a>我是A</a>

克隆后返回的节点副本属于文档所有，但是在文档中还没有位置，需要使用其它方法来指定其位置

7. normalize

唯一的作用是处理文档树中的文本节点。由于解析器的实现或 DOM 操作等原因，可能出现文本节点不包含文本，或者连续出现两个文本节点的情况。

在某个节点上调用这个方法，就会在其后代节点中处理这两种情况：

• 空文本节点，则删除

• 相邻文本节点，则合并