DOM和BOM的區別與聯系
文檔對象模型 (DOM):處理網頁內容的方法和接口
瀏覽器對象模型(BOM):與瀏覽器交互的方法和接口
1. DOM 是 W3C的標準;[所有瀏覽器公共遵守的標準]
2. BOM 是 各個瀏覽器廠商根據 DOM
在各自瀏覽器上的實現;[表現為不同瀏覽器定義有差別,實現方式不同]
3. window 是 BOM對象,而非js對象;
DOM(文檔對象模型)是 HTML 和 XML 的應用程序接口(API)。
BOM 主要處理瀏覽器窗口和框架,不過通常瀏覽器特定的 JavaScript 擴展都被看做 BOM 的一部分。這些擴展包括:
彈出新的瀏覽器窗口
移動、關閉瀏覽器窗口以及調整窗口大小
提供 Web 瀏覽器詳細信息的定位對象
提供用戶屏幕分辨率詳細信息的屏幕對象
對 cookie 的支持
IE 擴展了 BOM,加入了ActiveXObject類,可以通過JavaScript實例化ActiveX對象
javacsript是通過訪問BOM(Browser Object Model)對象來訪問、控制、修改客戶端(瀏覽器),由於BOM的window包含了document,window對象的屬性和方法是直接可以使用而且被感知的,因此可以直接使用window對象的document屬性,通過document屬性就可以訪問、檢索、修改XHTML文檔內容與結構。因為document對象又是DOM(Document Object Model)模型的根節點。可以說,BOM包含了DOM(對象),瀏覽器提供出來給予訪問的是BOM對象,從BOM對象再訪問到DOM對象,從而js可以操作瀏覽器以及瀏覽器讀取到的文檔。其中
DOM包含:window
Window對象包含屬性:document、location、navigator、screen、history、frames
Document根節點包含子節點:forms、location、anchors、images、links
從window.document已然可以看出,DOM的最根本的對象是BOM的window對象的子對象。
區別:DOM描述了處理網頁內容的方法和接口,BOM描述了與瀏覽器進行交互的方法和接口
DOM定義了一個HTMLDocument和HTMLElement做為這種實現的基礎,就是說為了能以編程的方法操作這個 HTML 的內容(比如添加某些元素、修改元素的內容、刪除某些元素),我們把這個 HTML 看做一個對象樹(DOM樹),它本身和裏面的所有東西比如 <div></div> 這些標簽都看做一個對象,每個對象都叫做一個節點(node),節點可以理解為 DOM 中所有 Object 的父類。
BOM
BOM 是 Browser Object Model,瀏覽器對象模型。
剛才說過 DOM 是為了操作文檔出現的接口,那 BOM 顧名思義其實就是為了控制瀏覽器的行為而出現的接口。
瀏覽器可以做什麽呢?比如跳轉到另一個頁面、前進、後退等等,程序還可能需要獲取屏幕的大小之類的參數。
所以 BOM 就是為了解決這些事情出現的接口。比如我們要讓瀏覽器跳轉到另一個頁面,只需要
location.href = "http://www.xxxx.com";
這個 location 就是 BOM 裏的一個對象。
window
window 也是 BOM 的一個對象,除去編程意義上的“兜底對象”之外,通過這個對象可以獲取窗口位置、確定窗口大小、彈出對話框等等。例如我要關閉當前窗口:
window.close();
DOM 是為了操作文檔出現的 API,document 是其的一個對象;
BOM 是為了操作瀏覽器出現的 API,window 是其的一個對象。
DOM和BOM的區別與聯系