什麼是Dom？
1.簡介
文檔物件模型（Document Object Model，簡稱DOM），是W3C組織建議的處理可擴充標誌語言的標準程式介面。 Document Object Model的歷史可以追溯至1990年代後期微軟與Netscape的“瀏覽器大戰”，雙方為了在JavaScript與JScript一決生死，於是大規模的賦予瀏覽器強大的功能。微軟在網頁技術上加入了不少專屬事物，計有VBScript、ActiveX、以及微軟自家的DHTML格式等，使不少網頁使用非微軟平台及瀏覽器無法正常顯示。 DOM即是當時蘊釀出來的傑作。
DOM（文件物件模型）是HTML和XML的應用程式介面（API）。 DOM將把整個頁面規劃成由節點層級構成的文檔。
所謂文件物件模型，其實就是對網頁HTML中的各種元素的一種內部的表示，例如HTML中的頭、段落、列表、風格、ID等，所有的元素都能透過DOM來存取 。
JavaScript最後是操作Html頁面，讓Html變成DHtml，操作Html頁面要用到DOM。 DOM就是把Html頁面模擬成一個對象，如果JavaScript只是執行一些計算、循環等操作，而不能操作Html也就失去了它存在的意義。
DOM就是Html頁面的模型，將每個標籤都做為一個對象，JavaScript透過呼叫DOM中的屬性、方法就可以對網頁中的文字方塊、層等元素進行程式控制。例如透過操作文字方塊的DOM對象，就可以讀取文字方塊中的值、設定文字方塊中的值。
2.圖解
關於window整個頁面或是說視窗就是一個window物件---------------window是頂級物件
頁面中定義的變數和方法都是window的
window.id
document.getElementById()
使用window物件的屬性、方法的時候可以省略window。
例如：
window.alert(‘hello');
可以省略成alert(‘hello');
window.document可以直接寫document
能不寫window就不要寫，這樣可以減少js檔案的位元組數。
建議使用window.location.href=‘url';//支援大多數瀏覽器
動態操作DOM元素
1.取得DOM
getElementById(), （非常常用），根據元素的Id獲得對象，網頁中id不能重複。也可以直接透過元素的id來引用元素，但有有效範圍、
getElementsByName()，根據元素的name獲得對象，由於頁面中元素的name可以重複，例如多個RadioButton的name一樣，因此getElementsByName返回值是物件數組。
getElementsByTagName()，取得指定標籤名稱的元素數組，例如getElementsByTagName(“input”)可以獲得所有的標籤。 *表示所有標籤
2.添加、移除、替換
document.write只能在頁面載入過程中動態建立。
可以呼叫document的createElement方法來建立具有指定標籤的DOM對象，然後透過呼叫某個元素的appendChild();方法將新建立元素新增到對應的元素下。 //父元素物件.removeChild(子元素物件);刪除元素。
createElement(‘element');建立一個節點
appendChild(node); 追加一個節點
removeChild(node);移除一個節點
replaceChild(new,old);替換一個節點
insertBefore(new,參考);把節點加到前面（插到某個節點前面）
方法：
屬性：
firstChild
lastChild
3.用innerHTML還是createElement()、appendChild()與removeChild()？
操作頁面的元素的時候是用innerHTML的方式還是createElement()、appendChild()與removeChild()的方式？
1.對於大量進行節點操作時，使用innerHTML的方式性能要好於頻繁的Dom操作(有專門用C或C 寫的html解析器。)。先將頁面的HTML程式碼寫好，然後呼叫一次innerHTML,而不要重複呼叫innerHTML.
2.對於使用innerHTML=‘'的方式來刪除節點，在某些情況下會存在記憶體問題。例如：div下面有很多其他元素，每個元素都綁定有事件處理程序。此時，innerHTML只是把當前元素從節點樹上移除了，但是那些事件處理程序依然佔用記憶體。
js操作樣式
修改元素的樣式是className屬性。
(class是JavaScript的保留字，屬性不能用關鍵字、保留字所以就變成className了)網頁開關燈的效果。
修改元素的樣式不能this.style="background-color:Red"。
單獨修改樣式的屬性使用「style.屬性名稱」。注意css中屬性名在JavaScript中操作的時候屬性名可能不一樣，主要集中在那些屬性名中含有-的屬性，因為JavaScript中-是不能做屬性、類名的。
操作float樣式的時候
IE:obj.style.styleFloat=‘right';
其他瀏覽器：obj.style.cssFloat=‘right';
Form物件
常用：click(),focus(),blur();//相當於透過程式觸發元素的點擊、獲得焦點、失去焦點的事件。
form物件是表單的Dom物件。
方法：submit()提交表單，但是不會觸發onsubmit事件。
實作autopost，也就是焦點離開控制項以後頁面立即提交，而不是只有提交submit按鈕以後才提交，當遊標離開的時候觸發onblur事件，在onblur中呼叫form的submit方法。
點擊submit後form的onsubmit事件被觸發，在onsubmit中可以進行資料校驗，如果資料有問題，返回false即可取消提交
以上所述就是個人對於javascript的DOM的理解了，希望大家能夠喜歡。
