DOM 是Document Object Model( 文件物件模型 )的縮寫。 

DOM是把html裡面的各種資料當作物件進行操作的一種思路。 (面向物件的角度看html的標籤)

節點概念

DOM把所有的html都轉換為節點 
整個文件 是一個節點 
元素 是節點 
元素屬性 是節點 
元素內容 是節點 
註釋 也是節點 
 

獲取節點

注:獲取節點為null,可能是在執行到 document.getElementById的時候，div標籤還沒有載入，所以無法獲取。因為javascript是解釋語言，是順序執行的。

節點的屬性

樣式

一個元素節點的style屬性即對應的css

通過給元素的style.backgroundColor 賦值，修改樣式
你也許注意到了style.backgroundColor 這裡的backgroundColor和css中的背景色background-color是有所不同的
換句話說，通過DOM的style去修改樣式，需要重新記憶另一套樣式名稱，這是很累贅的事情。
最好能夠通過CSS的屬性名，直接就進行修改了。比如通過這樣的方式：

d1.css("background-color","green");

這樣就僅僅需要使用CSS原本的屬性名即可了。
Javascript並不提供這樣的解決方案，但是到了JQuery就提供了這樣的解決方案

事件

節點關係

建立節點

例:

/*定義 函式,建立標籤*/
function createTag(tagName,tagVal){
    var tag=document.createElement(tagName);
    tag.className=tagVal;
    return tag;
}
/*根據id或class 查詢標籤*/
function $(selector){
    return document.querySelector(selector);
}