DOM:document object model 文檔對象模型
DOM就是描述整個html頁面中節點關系的圖譜，可以如下圖理解
在DOM中，提供了很多的獲取元素的方法和之間關系的屬性以及操作這些元素的方法。
1、獲取頁面中元素的方法
1）、document.getElementById('元素的ID') 在整個文檔中，通過元素的ID獲取到這個元素對象(獲取的是一個元素)
注意:如果頁面中的id重復了，那么這個方法默認只獲得第一個元素
在ie6、7中,會把表單元素（input）的name屬性值當做ID來使用
在ie6、7中，不區分ID的大小寫
項目實戰注意:不要讓表單元素的name和其他元素的id重復，不要用id的大小寫來區分我們的不同元素
如果沒有獲取到，返回的 結果為null
我們可以直接的用元素的id來代表當前元素對象（不推薦）
2）、通過元素的標簽名，來獲取一組元素（有幾個獲取幾個）
document.getElementsByTagName('元素的標簽名') 在整個文檔中，通過元素的標簽名獲取一組元素。獲取的是一個對象數據類型結果，並且是一個類數組（以數字作為索引，索引從0開始，逐級遞增，索引代表的是當前對應的某一個元素，有一個叫做length的屬性代表獲取的個數）
document稱之為上下文(context)，就是我們自己可以限定當前獲取元素的范圍[getElementById的上下文只能是document]
3）、context.getElementsByName()通過元素的name屬性的值獲取一組元素
在ie瀏覽器下只對表單元素起作用
這個方法應用於獲取具有同樣name的表單元素
4）、context.getElementsByClassName() 通過元素的類名（class的值） 是項目中最常用的一種方法，但是在ie6-ie8中會報錯。獲取多個的這幾個方法，即使你獲取的只有一個，他也是類數組，也是一個集合，如果想用其中的第一個，你也要通過索引拿出來用。
5）、document.documentElement //獲取HTML元素
document.body//獲取body元素
var curWidth = document.documentElement.clientWidth || document.body.clientWidth//兼容所有瀏覽器的獲取當前屏幕的寬度
var curHeight = document.documentElement.clientHeight || document.body.clientHeight//兼容所有瀏覽器的獲取當前屏幕的高度
6）在移動端我們回去元素常用的方法（IE6~8下不兼容）
document.querySelector()獲取一個
document.querySelectorAll()獲取多個
querySelector、jquery中的選擇器參考的是css選擇器的規則