DOM與BOM分別是什麼，有何關聯？

01-13

BOM是由navigator、history、screen、location、document五個對象組成的？而DOM與document又是什麼關係呢？望各位知者解惑~

Document Object Model（文檔對象模型），就是把「文檔」當做一個「對象」來看待。

相應的，Browser Object Model（瀏覽器對象模型）,即把「瀏覽器」當做一個「對象」來看待。

在 DOM 中，文檔中的各個組件（component），可以通過 object.attribute 這種形式來訪問。一個 DOM 會有一個根對象，這個對象通常就是 document。

而 BOM 除了可以訪問文檔中的組件之外，還可以訪問瀏覽器的組件，比如問題描述中的 navigator（導航條）、history（歷史記錄）等等。

在這種「XOM」的模型中，最應該理解的就是 Object Model。Object Model 就表示你可以通過像操作對象一樣，來操作這個 X。

再解釋一下什麼是對象（Object）。

在編程領域中，對象就是指的一種擁有具體數據（Data）並且具有（並不總是）特定行為（Behavior）的東西。例如，一個人，就可以看做一個對象。人的年齡、性別、身高、體重就是上文說的具體「數據」，通常將對象擁有的具體數據稱作對象的「屬性（Attribute）」；而人吃飯，睡覺，行走等能力，就是上文所說的「行為」，通常，我們把對象的行為稱作對象的「方法（Method）」。另外，對象是可以嵌套的，也就是是說，一個對象的屬性也可以是對象。

上文所說的「像操作對象一樣」，最主要就是指訪問對象的屬性和調用對象的方法。對象的屬性可以通過 object.attribute 這種形式來訪問，對象的方法可以通過 object.method(arguments) 這種形式來調用。

對應到 DOM 中，document 這個根對象就有很多屬性，例如 title 就是 document 的一個屬性，可以通過 document.title 訪問；document 對象也有很多方法，例如 getElementById，可以通過 document.getElementById(nodeId) 調用。

Dom相當於把html頁面結構解析成一個對象，提供一個介面API，讓你去操作所有的節點。其實就是document對象，沒發現所有的頁面元素選擇基本上都是從document衍生出來的嘛。

此外，Bom基本上就是指當前窗口對象，就是window對象啦。你看document也是掛在window對象了。什麼關於窗口的一些東西都是掛在window的了，比如alert之類的。

接觸前端有一年了，對於Dom和Bom的理解程度依然停留在初學者階段，學習前端的方法也有問題，為了找工作，幾句求成，在項目經驗上使用過多種框架，但是基礎是真的不牢固啊，這樣是永遠提高不上去的。

很好！

DOM即是document

es的兩個擴展罷了，es本身也定義了Math，Date這些內置對象，意義是一樣的，組合起來就是通常意義上的js了。