[轉] JavaScript學習：BOM和DOM的區別和關聯

標籤：

BOM

1.  BOM是Browser Object Model的縮寫，即瀏覽器物件模型。

2.  BOM沒有相關標準。

3.  BOM的最根本對象是window。

 

從1可以看出來：BOM和瀏覽器關係密切。瀏覽器的很多東西可以通過JavaScript控制的，例如開啟新視窗、開啟新選項卡（標籤頁）、關閉頁面，把網頁設為首頁，或加入收藏夾，等等…這些涉及到的對象就是BOM。

從2可以看出來：由於沒有標準，不同的瀏覽器實現同一功能，可以需要不同的實現方式。對於上面說的功能，不同的瀏覽器的實現功能所需要的JavaScript代碼可能不相同。

例如加入收藏夾這麼一個功能：
IE瀏覽器: window.external.AddFavorite(url,title);

FireFox瀏覽器: window.sidebar.addPanel(title, url, "");

所以在寫這一塊的JavaScript代碼時，就要考慮瀏覽器安全色性了。

雖然BOM沒有一套標準，但是各個瀏覽器的常用功能的JavaScript代碼還是大同小異的，對於常用的功能實際上已經有預設的標準了。所以不用過於擔心瀏覽器安全色問題，不是每個瀏覽器都有自己的BOM，也不需要為每個瀏覽器都學習一套BOM，只是個別瀏覽器會有新增的功能會在BOM上體現出來。

 

DOM

1.      DOM是Document Object Model的縮寫，即文件物件模型。

2.      DOM是W3C的標準。

3.      DOM最根本對象是document（實際上是window.document）。

 

從1可以看出來：DOM和文檔有關，這裡的文檔指的是網頁，也就是HTML文檔。網頁是由伺服器發送給用戶端瀏覽器的，無論用什麼瀏覽器，接收到的HTML都是一樣的，所以DOM和瀏覽器無關，它關注的是網頁本身的內容。由於和瀏覽器關係不大，所以標準就好定了。

既然有標準了，大家就要按標準來了，不按標準來的瀏覽器就要打屁股了。

那麼JavaScript的DOM是幹什麼的呢？

我們知道HTML是由標籤組成的，標籤套標籤。JavaScript可以通過DOM擷取到底有哪些標籤，標籤裡面的屬性是什麼，內容是什麼等等…

從3中window.document已然可以看出，DOM的最根本的對象是BOM的window對象的子物件。

 

 

圖片轉自：http://www.dreamdu.com/

 

很好的說明的二者之間的關係：兩者的關係是BOM包含DOM。

 

叉叉哥   轉載請註明出處：http://blog.csdn.net/xiao__gui/article/details/8315148

[轉] JavaScript學習：BOM和DOM的區別和關聯