DOM操作-创建、添加、移除、移动、复制和查找节点等

参考资料：
https://www.jianshu.com/p/a44327733513
https://blog.csdn.net/fouerror/article/details/80710111
1、创建节点：

1.1 创建元素节点：createElement()
  栗子： var p = document.createElement("p");
         p.nodeType;//1
1.2 创建文本节点： createTextNode()
  栗子：var textNode = document.createTextNode("I am text node");
        textNode.nodeType;//3
1.3 文本节点的合并：normalize()
    在父节点调用，父节点的两个相邻的文本子节点会合成一个文本节点。
1.4 文本节点的分割：splitText(参数)
    参数为一个以0开始的文本下标索引。以此分割，参数左为一个文本节点，参数及右为另一个文本节点。
1.5 ->1.3和1.4的栗子：
    var p = document.createElement("p");
    var textNode = document.createTextNode("I am text node");
//appendChild()
    p.appendChild(textNode);
//分割
    var newTextNode = p.firstChild.splitText(5);
    p.firstChild.nodeValue;//"I am "
    p.lastChild.nodeValue;//"text node"
    newTextNode.nodeValue;//"text node"
//合并
  p.normalize();
  p.firstChild.nodeValue;//"I am text node"

2、添加节点

 2.1 向父节点的childNodes的末尾添加子节点：appendChild(nodeInsert)
  若添加的节点已存在childNodes中，则把该节点转移到末尾来。
  栗子见1.5
2.2 向父节点的childNodes的其他子节点前插入子节点：insertBefore(nodeInsert, nodeExist);
  当第二个参数为null时，insertBefore(nodeInsert, null)效果等同appendChild() 
2.3 通过innerHTML属性 添加节点（或者说替换子树）
  栗子： node.innerHTML = "
I become node by innerHTML
"；

3、复制节点

3 复制节点 cloneNode(bool)
栗子： nodeA.cloneNode(ture);
  参数为布尔值，参数设为true则进行深复制，会复制nodeA节点及其整个子树；参数为false进行浅复制，只复制nodeA节点；
  ps:cloneNode()并不复制js属性，但IE会复制相关事件处理程序

4、替换节点

4 替换节点 replaceChild(newNode, oldNode)
  栗子：oldNode.parentNode.replaceChild(newNode, oldNode);

5、移除节点

5 移除节点 removeChild(nodeA)
  栗子：nodeA.parentNode.removeChild(nodeA);

6、获取节点集合

假设当前对象为node 

返回父节点：node.parentNode
返回所有子节点：node.childNodes（包含文本节点及标签节点）,node.children 
返回第一个子节点：node.firstChild 
返回最后一个子节点： node.lastChild 
返回同属上一个子节点：node.nextSibling 
返回同属下一个子节点：node.previousSibling 
是否有子节点： node.hasChildNodes()
返回父级元素：node.node.parendElement
返回下一个兄弟元素：node.nextElementSibling
返回上一个兄弟元素：node.previousElementSibling
返回第一个子元素：node.firstElementChild
返回最后一个子元素：node.lastElementChild
是否有子元素：判断 node.children.length 
该节点下的所有文本：node.textContent
该节点下的文本： node.innerText