瀏覽器對(duì)象模型BOM

1、瀏覽器對(duì)象模型 BOM （ Browser Object Model ）- ZSDN時(shí)間2013-09-30 17:25:00 博客園-所有隨筆區(qū)原文 /zha ngwei595806165/p/3347619.html1、結(jié)構(gòu)BOM是Browser Object Model的縮寫，簡稱瀏覽器對(duì)象模型BOM提供了獨(dú)立于內(nèi)容而與瀏覽器窗口進(jìn)行交互的對(duì)象由于BOM主要用于管理窗口與窗口之間的通訊，因此其核心對(duì)象是windowBOM由一系列相關(guān)的對(duì)象構(gòu)成，并且每個(gè)對(duì)象都提供了很多方法與屬性BOM缺乏標(biāo)準(zhǔn)，JavaScript語法的標(biāo)準(zhǔn)化組織是ECMA, DO

2、M的標(biāo)準(zhǔn)化組織是W3C（WHATWG,WebHypertextApplicatio nTech nologyWorki ngGroup網(wǎng)頁超文本應(yīng)用程序技術(shù)工作組目前正在努力促進(jìn)BOM的標(biāo)準(zhǔn)化）BOM最初是Netscape瀏覽器標(biāo)準(zhǔn)的一部分 結(jié)構(gòu)圖如下：2、BOM的作用BOM提供了一些訪問窗口對(duì)象的一些方法，我們可以用它來移動(dòng)窗口位置，改變窗口大小，打開新窗口和關(guān)閉窗口，彈出對(duì)話框，進(jìn)行導(dǎo)航以及獲取客戶的一些信息如：瀏覽器品牌版本，屏幕分辨率。但BOM最強(qiáng)大的功能是它提供了一個(gè)訪問HTML頁面的一入口document對(duì)象，以使得我們可以通過這個(gè)入口來使用DOM的強(qiáng)大功能！ ！window 對(duì)象

3、是 BOM的頂層（核心）對(duì)象，所有對(duì)象都是通過它延伸出來的，也可以稱為 window 的子對(duì)象。由于 window 是頂層對(duì)象，因此調(diào)用它的子對(duì)象時(shí)可以不顯示的指明 window對(duì)象，例如下面兩行代碼是一樣的：View Codewindow - window 對(duì)象是BOM中所有對(duì)象的核心。 window對(duì)象表示整個(gè)瀏覽器窗口，但不必表示其中包含的內(nèi)容。此外，window還可用于移動(dòng)或調(diào)整它表示的瀏覽器的大小，或者對(duì)它產(chǎn)生其他影響。JavaScript中的任何一個(gè)全局函數(shù)或變量都是window的屬性。3、window子對(duì)象document 對(duì)象frames對(duì)象history 對(duì)象location

4、 對(duì)象navigator 對(duì)象scree n對(duì)象4、window對(duì)象關(guān)系屬性pare nt :如果當(dāng)前窗口為 frame，指向包含該 frame的窗口的frame (frame)self :指向當(dāng)前的 window對(duì)象，與 window同意。 (window對(duì)象)top :如果當(dāng)前窗口為 frame，指向包含該 frame的top-level的window 對(duì)象 window :指向當(dāng)前的 window對(duì)象，與self同意。opener :當(dāng)窗口是用javascript打開時(shí)，指向打開它的那人窗口(開啟者)5、window對(duì)象定位屬性IE提供了 window.screenLeft和window

5、.screenTop對(duì)象來判斷窗口的位置，但未提供任何判 斷窗口大小的方法。用document.body.offsetWidth 和 document.body. offsetHeight 屬性可以獲取視口的大小(顯示 HTML頁的區(qū)域)，但它們不是標(biāo)準(zhǔn)屬性。Mozilla提供 window.screenX和 window.screenY屬性判斷窗口的位置。它還提供了 window.innerWidth 和 window.innerHeight 屬性來判斷視口的大小， window.outerWidth 和 window.outerHeight屬性判斷瀏覽器窗口自身的大小。6、window對(duì)象

6、的方法window方法及其描述方法描述alert()彈出一個(gè)帶有一段消息和確認(rèn)按鈕的窗體blur() 把鍵盤焦點(diǎn)從頂層窗口移開clearInterval()取消由 setInterval()設(shè)置的 timeoutclearTimeout() 取消有 setTimeout()方法設(shè)置的 timeout close()關(guān)閉瀏覽器窗口confirm。顯示帶有一段消息以及確認(rèn)按鈕盒取消按鈕的對(duì)話框 focus()把鍵盤焦點(diǎn)給予一個(gè)窗口moveBy()可相對(duì)窗口的當(dāng)前坐標(biāo)移動(dòng)指定的像素 moveTo()把窗口的左上角移動(dòng)到一個(gè)指定的坐標(biāo) ope n()打開一個(gè)新的瀏覽器窗體prompt()顯示可提示用戶

7、輸入的對(duì)話框 resizeBy()按照指定的像素調(diào)整窗口的大小 resizeTo()把窗體的大小調(diào)整到指定的寬度和高度 scrollBy()按照指定的像素值來滾動(dòng)內(nèi)容 scrollTo()把內(nèi)容滾動(dòng)到指定的坐標(biāo)set In terval()按照指定的周期(毫秒)來調(diào)用函數(shù)或計(jì)算表達(dá)式setTimeout()在指定的毫秒數(shù)后調(diào)用函數(shù)或表達(dá)式View Code窗體控制moveBy(x,y)從當(dāng)前位置水平移動(dòng)窗體x個(gè)像素，垂直移動(dòng)窗體y個(gè)像素，x為負(fù)數(shù)，將向左移動(dòng)窗體，y為負(fù)數(shù)，將向上移動(dòng)窗體moveTo(x,y)移動(dòng)窗體左上角到相對(duì)于屏幕左上角的(x,y)點(diǎn)，當(dāng)使用負(fù)數(shù)做為參數(shù)時(shí)會(huì)吧窗體移出屏幕的

8、可視區(qū)域resizeBy(w,h)相對(duì)窗體當(dāng)前的大小，寬度調(diào)整w個(gè)像素，高度調(diào)整 h個(gè)像素。如果參數(shù)為負(fù)值，將縮小窗體，反之?dāng)U大窗體resizeTo(w,h)把窗體寬度調(diào)整為 w個(gè)像素，高度調(diào)整為h個(gè)像素窗體滾動(dòng)軸控制scrollTo(x,y)在窗體中如果有滾動(dòng)條，將橫向滾動(dòng)條移動(dòng)到相對(duì)于窗體寬度為x個(gè)像素的位置，將縱向滾動(dòng)條移動(dòng)到相對(duì)于窗體高度為y個(gè)像素的位置scrollBy(x,y)如果有滾動(dòng)條，將橫向滾動(dòng)條移動(dòng)到相對(duì)于當(dāng)前橫向滾動(dòng)條的x個(gè)像素的位置(就是向左移動(dòng)x像素)，將縱向滾動(dòng)條移動(dòng)到相對(duì)于當(dāng)前縱向滾動(dòng)條高度為y個(gè)像素的位置(就是向下移動(dòng)y像素)窗體滾動(dòng)軸控制scrollTo(x,y

9、)在窗體中如果有滾動(dòng)條，將橫向滾動(dòng)條移動(dòng)到相對(duì)于窗體寬度為x個(gè)像素的位置，將縱向滾動(dòng)條移動(dòng)到相對(duì)于窗體高度為y個(gè)像素的位置scrollBy(x,y)如果有滾動(dòng)條，將橫向滾動(dòng)條移動(dòng)到相對(duì)于當(dāng)前橫向滾動(dòng)條的x個(gè)像素的位置(就是向左移動(dòng)x像素)，將縱向滾動(dòng)條移動(dòng)到相對(duì)于當(dāng)前縱向滾動(dòng)條高度為y個(gè)像素的位置(就是向下移動(dòng)y像素)窗體焦點(diǎn)控制focus()使窗體或控件獲取焦點(diǎn)blur()與focus函數(shù)相反，使窗體或控件失去焦點(diǎn)新建窗體open()打開(彈出)一個(gè)新的窗體close()關(guān)閉窗體opener屬性一一新建窗體中對(duì)父窗體的引用，中文開啟者”的意思window.open方法語法win dow.op

10、e n( url, n ame, features, replace);open方法參數(shù)說明url -要載入窗體的 URLname -新建窗體的名稱(目標(biāo),將在a標(biāo)簽的target屬性中用到，當(dāng)與已有窗體名稱相同時(shí) 將覆蓋窗體內(nèi)容).open函數(shù)默認(rèn)的打開窗體的方式為target的_blank彈出方式，因此頁面都 將以彈出的方式打開features -代表窗體特性的字符串，字符串中每個(gè)特性使用逗號(hào)分隔replace - 一個(gè)布爾值，說明新載入的頁面是否替換當(dāng)前載入的頁面，此參數(shù)通常不用指定 open函數(shù)features參數(shù)說明，如果不使用第三個(gè)參數(shù)，將打開一個(gè)新的普通窗口參數(shù)名稱類型說明hei

11、ghtNumber設(shè)置窗體的高度，不能小于100leftNumber說明創(chuàng)建窗體的左坐標(biāo)，不能為負(fù)值locati onBoolea n窗體是否顯示地址欄，默認(rèn)值為noresizableBoolea n窗體是否允許通過拖動(dòng)邊線調(diào)整大小，默認(rèn)值為noscrollbarsBoolea n窗體中內(nèi)部超出窗口可視范圍時(shí)是否允許拖動(dòng)，默認(rèn)值為notoolbarBoolea nsetTimeout()暫停指定的毫秒數(shù)后執(zhí)行指定的代碼topNumber說明創(chuàng)建窗體的上坐標(biāo)，不能為負(fù)值statusBoolea n窗體是否顯示狀態(tài)欄，默認(rèn)值為nowidthNumber創(chuàng)建窗體的寬度，不能小于100特性字符串中的每

12、個(gè)特性使用逗號(hào)分隔，每個(gè)特性之間不允許有空格open方法返回值為一個(gè)新窗體的window對(duì)象的引用對(duì)話框alert（str）彈出消息對(duì)話框（對(duì)話框中有一個(gè)確定按鈕）confirm（str）彈出消息對(duì)話框（對(duì)話框中包含一個(gè)確定按鈕與取消按鈕）prompt（str,defaultValue）彈出消息對(duì)話框（對(duì)話框中包含一個(gè)確定按鈕、取消按鈕與一個(gè)文本輸入框），由于各個(gè)瀏覽器實(shí)現(xiàn)的不同，若沒有第二個(gè)參數(shù)（文本框中的默認(rèn)值）時(shí)也最好提供一個(gè)空字符串狀態(tài)欄window.defaultStatus屬性改變?yōu)g覽器狀態(tài)欄的默認(rèn)顯示（當(dāng)狀態(tài)欄沒有其它顯示時(shí)），瀏覽器底部的區(qū)域稱為狀態(tài)欄，用于向用戶顯示信息win

13、dow.status屬性臨時(shí)改變?yōu)g覽器狀態(tài)欄的顯示 時(shí)間等待與間隔函數(shù)clearTimeout()取消指定的setTimeout函數(shù)將要執(zhí)行的代碼set In terval()間隔指定的毫秒數(shù)不停地執(zhí)行指定的代碼clearlnterval()取消指定的setlnterval函數(shù)將要執(zhí)行的代碼setTimeout與setlnterval方法有兩個(gè)參數(shù)，第一個(gè)參數(shù)可以為字符串形式的代碼，也可以是 函數(shù)引用，第二個(gè)參數(shù)為間隔毫秒數(shù)，它們的返回是一個(gè)可用于對(duì)應(yīng)clear方法的數(shù)字ID var tid = setTimeout(alert(1),1000);alert(tid);clearTimeout

14、(tid);7、History對(duì)象，在瀏覽器歷史記錄中導(dǎo)航History對(duì)象的屬性:length返回瀏覽器歷史列表中的URL數(shù)量History對(duì)象的方法back()加載history列表中的前一個(gè)URLforward。加載history列表中的下一個(gè)URLgo(num)加載history列表中的某個(gè)具體頁面& Location 對(duì)象Location對(duì)象的屬性hash設(shè)置或返回從井號(hào)(#)開始的URL (錨)host設(shè)置或返回主機(jī)名和當(dāng)前URL的端口號(hào)host name設(shè)置或返回當(dāng)前 URL的主機(jī)名href設(shè)置或返回完整的URLpath name設(shè)置或返回當(dāng)前 URL的路徑部分port設(shè)置或返回

15、當(dāng)前URL的端口號(hào)protocol設(shè)置或返回當(dāng)前URL的協(xié)議search設(shè)置或返回從問號(hào) 開始的URL (查詢部分)Location對(duì)象的方法assign()加載新的文檔，這與直接將一個(gè) URL賦值給Location對(duì)象的href屬性效果是一樣的 reload()重新加載當(dāng)前文檔，如果該方法沒有規(guī)定參數(shù)，或者參數(shù)是false，它就會(huì)用 HTTP頭If-Modified-Since來檢測服務(wù)器上的文檔是否已改變。如果文檔已改變，reload()會(huì)再次下載該文檔。如果文檔未改變，則該方法將從緩存中裝載文檔。這與用戶單擊瀏覽器的刷新按鈕的效果是完全一樣的。如果把該方法的參數(shù)設(shè)置為true，那么無論文

16、檔的最后修改日期是什么，它都會(huì)繞過緩存，從服務(wù)器上重新下載該文檔。這與用戶在單擊瀏覽器的刷新按 鈕時(shí)按住Shift健的效果是完全一樣。replace。用新的文檔替換當(dāng)前文檔，replace。方法不會(huì)在 History對(duì)象中生成一個(gè)新的紀(jì)錄。當(dāng)使用該方法時(shí)，新的URL將覆蓋History對(duì)象中的當(dāng)前紀(jì)錄。9、Navigator 對(duì)象Navigator對(duì)象的屬性appCodeName返回瀏覽器的代碼名appName返回瀏覽器的名稱 appVersion返回瀏覽器的平臺(tái)和版本信息browserLanguage返回當(dāng)前瀏覽器的語言cookieEnabled返回指明瀏覽器中是否啟用cookie的布爾值c

17、puClass返回瀏覽器系統(tǒng)的CPU等級(jí)onLine返回指明系統(tǒng)是否處于脫機(jī)模式的布爾值 platform返回運(yùn)行瀏覽器的操作系統(tǒng)平臺(tái)systemLanguage返回OS使用的默認(rèn)語言 userAge nt返回由客戶機(jī)發(fā)送服務(wù)器的user-age nt頭部的值userLanguage返回 OS的自然語言設(shè)置10、screen 對(duì)象javascript可以獲取某些關(guān)于用戶屏幕的信息屬性 描述availHeight 返回顯示屏幕的高度（除 window任務(wù)欄） availWidth 返回顯示屏幕的寬度（除 window任務(wù)欄）deviceXDPI返回顯示屏幕的每英寸水平點(diǎn)數(shù)deviceXDPI返回

18、顯示屏幕的每英寸垂直點(diǎn)數(shù)fon tSmoothi ngE nabled 返回用戶是否在顯示控制面板中開啟了字體平滑 height返回顯示屏幕的高度logicalXDPI返回顯示屏幕每英寸的水平方向的常規(guī)點(diǎn)數(shù)logicalYDPI返回顯示屏幕每英寸的垂直方向的常規(guī)點(diǎn)數(shù) pixelDepth 返回顯示屏幕的顏色分辨率（比特每像素）updateI nterval設(shè)置或返回屏幕的刷新率width返回顯示器屏幕的寬度每個(gè)window對(duì)象的screen屬性都引用screen對(duì)象。該對(duì)象存放著有關(guān)顯示器屏幕相關(guān)的 信息，我們可以根據(jù)這些信息來優(yōu)化頁面的輸入等等。11、框架與多窗口通信子窗口與父窗口只有自身和使用 window.open方法打開的窗口和才能被JavaScript