四象陣法: 增加 刪除 改變 查找 【為了便於記憶，減少占用大腦內存，我命名為JS心法為：道陣法，兩儀陣法，三才陣法，四象陣法，五行陣法，只需記住陣法的關鍵字，即可搜索大腦中相應的內容，學會JS五大陣法即可學會JS】

DOM操作增刪該查 （Document文檔 Object對象 Model模型）

增加節點：

var div=document.createElement("div");

var text=document.createTextNode("我是文本節點");

fatherNode.appChild(childNode);【在fatherNode元素內部添加childNode】

fatherNode.insertBefore(insertNode,targetNode);【在fatherNode元素內部添加childNode】

node.cloneNode(ture);【true復制node節點及其子節點，false只復制node節點，不填時默認為false，復制img標簽時可以用false】

刪除節點：

fatherNode.removeChild(childNode);【刪除fatherNode元素內部節點childNode】

改變節點:

fatherNode.replaceChild(replaceNode，targetNode)；【如果replaceNode是已存在節點，會把target刪除，把replaceNode放在此處】

查找:

var idSelector=document.getElementById("#selector");

var tagSelector=document.getElementsByTagName("div");

var tagSelector=idSelector.getElementsByTagName("div");【只選擇idSelector的div】

H5元素選擇器

var classSelector=document.getElementsByClassName(".selector")【支持IE9+】

var query=document.querySelector("#selector") 【支持CS中所有的選擇器】【支持IE8+】【返回第一個匹配的元素】

var queryAll=document.querySelectorAll(".selector")【支持CS中所有的選擇器】【支持IE8+】【返回所有匹配的節點列表nodeList類數組】

【classList系列 IE9+支持】

classList.add("class1,class2.....") 【添加一個或多個類名】

classList.remove("class1,class2.....") 【刪除一個或多個類名】

classList.toggel("class") 【切換類名】

classList.contains("class") 【判斷類名是否存在，存在未true，不存在為false】

clasList.item(index) 【返回指定索引的類名】

classList.length 【返回類名的個數】

JS學習之路系列總結四象陣（此文猶如武林之中的易筋經，是你馳騁IT界的武功心法，學會JS五大陣法就學會了JS，博主建議先學三才陣）