DOM
文檔對象模型 (DOM) 是HTML和XML文檔的編程接口。它給文檔（結構樹）提供了一個結構化的表述并且定義了一種方式—程序可以對結構樹進行訪問，以改變文檔的結構，樣式和內(nèi)容。
DOM 提供了一種表述形式將文檔作為一個結構化的節(jié)點組以及包含屬性和方法的對象。從本質上說，它將web 頁面和腳本或編程語言連接起來了。
要改變頁面的某個東西，JavaScript就需要獲得對HTML文檔中所有元素進行訪問的入口。這個入口，連同對 HTML 元素進行添加、移動、改變或移除的方法和屬性，都是通過DOM來獲得的
Document對象常用方法
1.open(),close()
document.open方法用于新建一個文檔，供write方法寫入內(nèi)容。它實際上等于清除當前文檔，重新寫入內(nèi)容
document.close方法用于關閉open方法所新建的文檔。一旦關閉，write方法就無法寫入內(nèi)容了。
2.write()
document.write方法用于向當前文檔寫入內(nèi)容。只要當前文檔還沒有用close方法關閉，它所寫入的內(nèi)容就會追加在已有內(nèi)容的后面。
如果頁面已經(jīng)渲染完成再調用write方法，它會先調用open方法，擦除當前文檔所有內(nèi)容，然后再寫入。
如果在頁面渲染過程中調用write方法，并不會調用open方法。
需要注意的是，雖然調用close方法之后，無法再用write方法寫入內(nèi)容，但這時當前頁面的其他DOM節(jié)點還是會繼續(xù)加載。
除了某些特殊情況，應該盡量避免使用document.write這個方法。
Element對象
除了document對象，在DOM中最常用的就是Element對象了，Element對象表示HTML元素。
Element 對象可以擁有類型為元素節(jié)點、文本節(jié)點、注釋節(jié)點的子節(jié)點，DOM提供了一系列的方法可以進行元素的增、刪、改、查操作
Element有幾個重要屬性
nodeName：元素標簽名，還有個類似的tagName
nodeType：元素類型
className：類名
id：元素id
children：子元素列表（HTMLCollection）
childNodes：子元素列表（NodeList）
firstChild：第一個子元素
lastChild：最后一個子元素
nextSibling：下一個兄弟元素
previousSibling：上一個兄弟元素
parentNode、parentElement：父元素
查詢元素
getElementById()
getElementById方法返回匹配指定ID屬性的元素節(jié)點。如果沒有發(fā)現(xiàn)匹配的節(jié)點，則返回null。這也是獲取一個元素最快的方法
getElementByClassName()
getElementsByClassName方法返回一個類似數(shù)組的對象（HTMLCollection類型的對象），包括了所有class名字符合指定條件的元素（搜索范圍包括本身），元素的變化實時反映在返回結果中。這個方法不僅可以在document對象上調用，也可以在任何元素節(jié)點上調用。
getElementByTagName()
getElementsByTagName方法返回所有指定標簽的元素（搜索范圍包括本身）。返回值是一個HTMLCollection對象，也就是說，搜索結果是一個動態(tài)集合，任何元素的變化都會實時反映在返回的集合中。這個方法不僅可以在document對象上調用，也可以在任何元素節(jié)點上調用。
querySelector()
querySelector方法返回匹配指定的CSS選擇器的元素節(jié)點。如果有多個節(jié)點滿足匹配條件，則返回第一個匹配的節(jié)點。如果沒有發(fā)現(xiàn)匹配的節(jié)點，則返回null。
querySelectorAll()
querySelectorAll方法返回匹配指定的CSS選擇器的所有節(jié)點，返回的是NodeList類型的對象。NodeList對象不是動態(tài)集合，所以元素節(jié)點的變化無法實時反映在返回結果中。
創(chuàng)建元素
creatElement()
createElement方法用來生成HTML元素節(jié)點。
createElement方法的參數(shù)為元素的標簽名，即元素節(jié)點的tagName屬性。如果傳入大寫的標簽名，會被轉為小寫。如果參數(shù)帶有尖括號（即<和>）或者是null，會報錯。
creatTextNode()
createTextNode方法用來生成文本節(jié)點，參數(shù)為所要生成的文本節(jié)點的內(nèi)容。
createDocumentFragment()
createDocumentFragment方法生成一個DocumentFragment對象。
DocumentFragment對象是一個存在于內(nèi)存的DOM片段，但是不屬于當前文檔，常常用來生成較復雜的DOM結構，然后插入當前文檔。這樣做的好處在于，因為DocumentFragment不屬于當前文檔，對它的任何改動，都不會引發(fā)網(wǎng)頁的重新渲染，比直接修改當前文檔的DOM有更好的性能表現(xiàn)。
修改元素
appendChild()
在元素末尾添加元素
insertBefore()
在某個元素之前插入元素
replaceChild()
replaceChild()接受兩個參數(shù)：要插入的元素和要替換的元素
屬性操作
getAttribute()
getAttribute()用于獲取元素的attribute值
node.getAttribute('id');
creatAttribute()
createAttribute()方法生成一個新的屬性對象節(jié)點，并返回它。
attribute = document.createAttribute(name);
setAttribute()
setAttribute()方法用于設置元素屬性
var node = document.getElementById("div1");
node.setAttribute("my_attrib", "newVal");
var node = document.getElementById("div1");
var a = document.createAttribute("my_attrib");
a.value = "newVal";
node.setAttributeNode(a);
removeAttribute()
removeAttribute()用于刪除元素屬性
node.removeAttribute('id');
