一、Dom獲取
1、全稱：Document Object Model 文檔對象模型
2、我們常用的節點類型
元素（標簽）節點、文本節點、屬性節點（也就是標簽里的屬性）、
3、document有個屬性叫nodeType返回的是數字
1：代表元素節點
2：代表屬性節點
3：代表文本節點
4、節點的獲取
元素節點的獲取方法
Document.getElementById()
Document.getElementsByClassName()
Document.getElementsByTagName()
Document.querySelector()
Document.querySelectorAll()
屬性節點的獲取方法
元素 . getAttribute（"屬性名"） 獲取屬性值的方法
元素 . attribuites 獲取元素身上所有屬性構成的集合（數組）
元素 . attribute [ 索引 ] . value 獲取元素里面的值
元素 . setAttribute（"屬性名","屬性值"） 給元素設置屬性和屬性值
元素 . remove（"屬性"） 刪除元素
文本節點沒有獲取的方法，沒有意義
5、獲取元素的子節點
元素 . childNodes 這個屬性有兼容性，標准瀏覽器回獲取文本節點，而低版本的瀏覽器不會，所以建議children屬性
獲取單個子節點：具有兼容問題
獲取第一個子節點：
標准下：元素 . firstElementchild
非標准下：元素 . firstchild
獲取最后一個子節點：
標准下：元素 .lastElementchild
非標准下：元素 . lastchild
獲取上一個兄弟節點：
標准下：元素 . previousElementsibling
非標准下：元素 . previoussibling
獲取上一個兄弟節點：
標准下：元素 . nextElementchild
非標准下：元素 . nextchild
解決兼容性問題：
拿獲取第一個子節點為列：
var list=document . getElementById（"list"）
var ss=list . firstElementchild || list . firstchild
6、獲取父節點
元素 . parentNode 沒有兼容性
二、Dom 動態創建節點
1、生成節點的方法：
document . createElement（"div"）
2、插入節點的方法：
父節點 . appendChild（"新節點"）
3、在指定的位置插入節點
父節點 . inserBefore（新節點，誰的前面） 將元素插入指定節點的前面
4、刪除節點
父節點 . removechild（）
三、拓展
字符串中的拼接和Dom創建都是渲染的方試
字符串：
優點：簡單，可以處理數據，層次感比較強
缺點：字符串拼接會影響到原來子元素的事件
Dom創建：
優點：是一個獨立的個體，不會影響到原來的元素
缺點：處理數據量過大會比較麻煩，會造成Dom回流
Dom回流：
頁面渲染時，我們對html結構簡單的增刪查改時，瀏覽器會對所有的dom重新排序，這就是Dom回流，嚴重影響瀏覽器的性能
提升頁面性能優化：
1、多采用雪碧圖
2、阻止超鏈接的默認行為
3、減少DOM回流
4、減少向服務器請求次數