創建元素

document.createElement('tagName');

添加元素

parent.appendChild(childNode);

注：父元素調用該方法。

移動元素

由于DOM對象屬于引用類型，所以在操作appendChild和insertBefore方法時， 控制的節點如果是文檔中存在的節點，那么將把這個節點移到目標處。

復制節點

oLi.cloneNode(true);

注：參數true表示深度克隆（深拷貝），false 表示淺度克隆（淺拷貝），深拷貝也就是復制節點及整個節點數；淺拷貝復制節點本身。復制后返回的節點副本屬于文檔所有，但并沒有為它指定父節點。因此，整個節點副本就成為一個‘孤兒’：

<ul id='oUl'>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>

<script>
  var myList = document.getElementById("oUl"); 
  var deepList = myList.cloneNode(true);
  console.log(deepList.childNodes.length);//3 (IE<9) 或7 （其它瀏覽器）
  var shallowList = myList.cloneNode(false); 
  console.log(shallowList.childNodes.length);//0
</script>

cloneNode()方法不會復制添加DOM節點的JS屬性，例如事件處理程序等。這個方法只復制特性，其他一切都不會復制。

刪除節點

parentNode.removeChild(childNode);

注：父元素調用該方法，返回值為被刪除的節點。

替換元素

parentNode.replaceChild(newNode,oldNode);

注：oldNode節點必須是parentNode的子節點。

插入元素

parentNode.insertBefore(newEle, oldNode);

注：父元素調用該方法。

查找節點的總結

• childNodes—返回節點到子節點的節點列表firstChild— 返 回 節 點 的 首 個 子 節 點 ; lastChild—返回節點的最后一個子節點; nextSibling—返回節點之后緊跟的同級節點; nodeName—返回節點的名字，根據其類型; nodeType—返回節點的類型。
• nodeValue—設置或返回節點的值，根據其類型; ownerDocument—返回節點的根元素（document對象）; parentNode—返回節點的父節點。
• previousSibling—返回節點之前緊跟的同級節點。
• text—返回節點及其后代的文本（IE獨有）; xml—返回節點及其后代的XML（IE獨有）; 節點對象的方法。
• appendChild()—向節點的子節點列表的結尾添加新的子節點; cloneNode()—復制節點。
• hasChildNodes()—判斷當前節點是否擁有子節點; insertBefore()—在指定的子節點前插入新的子節點; normalize()—合并相鄰的Text節點并刪除空的Text節點; removeChild()—刪除（并返回）當前節點的指定子節點; replaceChild()—用新節點替換一個子節點。

IE6獨有方法

• selectNodes()—用一個XPath表達式查詢選擇節點; selectSingleNode()—查找和XPath查詢匹配的一個節點。
• transformNode()—使用XSLT把一個節點轉換為一個字符串。transformNodeToObject()—使用XSLT把一 個節點轉換成為一個文檔。

經典的問題解析。

創建新節點

createDocumentFragment() //創建一個DOM片段createElement() //創建一個具體的元素createTextNode() //創建一個文本節點。

添加、移除、替換、插入

appendChild() 
removeChild() 
replaceChild()
insertBefore() //在已有的子節點前插入一個新的子節點查找
getElementsByTagName() //通過標簽名稱
getElementsByName() //通過元素的Name屬性的值(IE容錯能力較強，會得到一個數組，其中包括id等于name值的)
getElementById() //通過元素Id，唯一性