Bom簡單介紹

1.什麼是bom？

全稱：瀏覽器對象模型（Browser Object Model）

bom是js的一部分，

2.bom的對象，方法和方法

bom提供了主要的8大對象：Window，Screen，Loacation，History，Navigator；Screen，Loacation，History，Navigator四大類是Window的成員，所以均可以經過Window.*去訪問。

1.Window

1.window是什麼

Window對象：表示瀏覽器打開的窗口、標籤或者框架(若當前頁面裏包含多個iframe，會爲每一個iframe建立Window對象)。

Window對象不會被實例化，調用屬性和方法都做爲window的靜態成員。

全局變量是 window 對象的屬性。

全局函數是 window 對象的方法。

2.window怎麼用

調用方式：調用Window對象的成員時，能夠省略前面的window。如：window.alert() 可寫成 alert() 。

3.Attribute

 readonly ApplicationCache applicationCache ：返回窗口的應用緩存對象。

 readonly boolean  closed ：返回窗口是否已經關閉。

 readonly Console console ：返回對Consol對象的引用，對瀏覽器控制檯進行操做。

 readonly int  devicePixelRatio ：返回設備像素比，即當前顯示器的物理像素和設備獨立像素(dip)的比例。

 readonly Document document ：返回當前窗口的Document對象。

 readonly Element frameElement ：若當前window處於一個<iframe>中，此屬性返回這個IFrame。若在頂級窗口，返回null。

 readonly Window [] frames ：返回一個包含窗口內全部的框架的數組。

 readonly History history ：返回一個History對象。可對當前頁的歷史進行操做，如：前進、後退等。

 readonly long innerHeight ：返回當前窗口可顯示HTML文檔的高度，單位px(像素)。

 readonly long innerWidth ：返回當前窗口可顯示HTML文檔的寬度，單位px(像素)。

 readonly long  length ：返回窗口內包含框架的數量，即frames數量。

 readonlyLocation location ：返回一個Location對象。可對當前頁面的URL進行操做，如：導航到新的頁面、獲取URL信息等。

 readonly LocalStorage localStorage ：返回一個鍵/值對存儲的Storage對象，持續到被用戶刪除。

 string name ：設置或獲取當前窗口的name。

 readonlyNavigator navigator ：返回一個Navigator 對象。包含瀏覽器信息。如：獲取瀏覽器名稱、版本信息、操做系統平臺信息等等。

 Window openner ：返回對打開當前窗口的原窗口一個引用。若當前窗口是由另外一個窗口打開的, window.opener保留對那個窗口的引用. 若是當前窗口不是由其餘窗口打開的，則該屬性返回 null。

 readonly long outerHeight ：返回當前瀏覽器的總高度，單位px(像素)。包含工具欄、滾動條、瀏覽器邊框等範圍。

 readonly long  outerWidth ：返回當前瀏覽器的總寬度，單位px(像素)。包含工具欄、滾動條、瀏覽器邊框等範圍。

 readonly long  pageXOffset ：返回文檔橫向滾動的距離，單位px(像素)。

 readonly long  pageYOffset ：返回文檔縱向滾動的距離，單位px(像素)。

 readonly Window parent ：返回當前窗口的父級窗口。若當前窗口是頂級窗口，返回當前窗口自己。若當前窗口爲一個框架窗口，返回它的父窗口。

 readonlyScreen screen ：返回一個Screen對象。包含屏幕信息。如：獲取屏幕高度、寬度等等。

 readonly long  screenX ：返回瀏覽器在屏幕的X座標。

 readonly long screenY ：返回瀏覽器在屏幕的Y座標。

 readonly long scrollX  ：返回文檔橫向滾動的距離，單位px(像素)。與pageXOffset屬性同樣。

 readonly long scrollY  ：返回文檔縱向滾動的距離，單位px(像素)。與pageYOffset屬性同樣。

 readonly Window self ：返回一個對當前Window對象的引用。

 readonly SessionStorage sessionStorage ：返回一個鍵/值對存儲的Storage對象，持續到當前瀏覽會話結束。

 readonly Window top ：返回當前窗口的頂級窗口。若當前窗口自己已是頂級，則返回自身。若當前窗口爲一個框架窗口，返回包含它的頂級窗口(parent只是返回父窗口)。

 readonly Window window ：返回當前窗口Window對象。

2.Method

 void  addEventListener (string eventType,function eventListener) ：給窗口註冊事件。eventType事件類型，如：click。eventListener：事件觸發的函數或對象。

 void alert (string msg) ：彈出一個包含msg和一個確認按鈕的警告框。

 string atob (string base64Str) ：將一個基於Base64編碼的字符串解碼爲一個字符串。

 void blur () ：當前窗口移除焦點。

 string btoa (string str) ：將一個字符串編碼爲一個Base64編碼。

 void clearInterval (long intervalHandle) ：中止intervalHandle指定的setInterval()。

 void clearTimeout (long timeoutHandle) ：中止timeoutHandle指定的setTimeout()。

 void close () ：關閉當前窗口。只能關閉由腳本打開的窗口，如：a元素打開新頁面。

 boolean confirm (string msg) ：顯示帶有一段消息以及確認按鈕和取消按鈕的對話框。點擊確認按鈕返回true，點擊取消按鈕返回false。

 void  focus () ：當前窗口得到焦點。

 void  moveBy (long deltaX, long deltaY) ：使open()方法建立的窗口，在自己的位置上，水平移動deltaX個像素，垂直移動deltaY個像素。

 void  moveTo (long x, long y) ：使open()方法建立的窗口，移動到x，y座標。

 Window open (string url, string target, string features, string replace) ：建立一個新的窗口。

 

 void  print () ：調用瀏覽器的打印按鈕。

 string prompt (string msg) ：彈出一個顯示msg信息幷包含一個肯定按鈕和取消按鈕的輸入框。此輸入框會阻塞頁面，點擊肯定按鈕返回輸入的內容，點擊取消按鈕返回null。

 void resizeBy (long deltaWidth, long deltaHeight) ：使open()方法建立的窗口，在自己的位置上，寬度增長deltaWidth個像素，高度增長deltaHeight個像素。

 void resizeTo (long width, long height) ：使open()方法建立的窗口，寬度變爲width，高度變爲height。

 void scrollBy (long deltaWidth, long deltaHeight) ：在當前滾動的基礎上，橫向滾動deltaWidth像素，縱向滾動deltaHeight像素。

 void scrollTo (long width, long height) ：橫向滾動到width像素距離上，縱向滾動到height像素距離上。

 long  setInterval (function fn, long time) ：每隔必定的週期(毫秒)執行指定函數。

 long setTimeout (function fn, long time) ：在必定的毫秒數後執行指點函數。

2.Screen

1.Screen是什麼

window.screen 對象包含有關用戶屏幕的信息,如一些屬性：

• screen.availWidth - 可用的屏幕寬度
• screen.availHeight - 可用的屏幕高度

 

2.如何使用

window.screen 對象在編寫時能夠不使用 window 這個前綴。

調用方式：window.screen 或者 screen。

3.Attribute

 readonly long  availHeight ：返回瀏覽器在屏幕的可用高度，單位px(像素)。可理解爲瀏覽器最大化的高度，通常爲屏幕高度減去上下系統任務欄或停靠欄。

 readonly long availWidth ：返回瀏覽器在屏幕的可用寬度，單位px(像素)。可理解爲瀏覽器最大化的寬度，通常爲屏幕寬度減去左右系統任務欄或停靠欄。

 readonly long  colorDepth ：返回屏幕的顏色深度。顏色深度簡單說就是最多支持多少種顏色,。通常是用「位」來描述的。好比BMP格式，則最多能夠支持紅、綠、藍各256種，總共24位。因此顏色深度是24。

 readonly long  height ：返回屏幕的高度，單位px(像素)。

 readonly long  pixelDepth ：返回屏幕的色彩深度。

 readonly long  width ：返回屏幕的寬度，單位px(像素)。

3.Navigator

1.What?

Navigator 對象包含有關瀏覽器的信息。如：獲取瀏覽器名稱、版本信息、操做系統平臺信息等等。

2.How?

調用方式：window.navigator 或者 navigator。

3.Attribute

 readonly string appName ：返回瀏覽器的名稱。基於 Netscape 的瀏覽器中，返回的是 "Netscape"。在 IE 中，返回值爲 "Microsoft Internet Explorer"。

 readonly string  appVersion ：返回瀏覽器版本和平臺信息。如：某個Chrome版本返回 "5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36"。

 readonly  Geolocation geolocation ：返回一個Geolocation對象，可獲取當前的地理信息。

 readonly string language ：返回瀏覽器界面語言。簡體中文返回："zh-CN"。

 readonly boolean onLine ：返回瀏覽器是否可鏈接網絡。

 readonly string  platform ：返回瀏覽器所在的系統平臺。如：Win32。

 readonly string userAgent ：返回由客戶機發送服務器的 user-agent 頭部的值。如："Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36".

 readonly  ServiceWorker serviceWorker ：返回ServiceWorker對象。serviceWorker運行於瀏覽器後臺的一種腳本，它能夠無需Web頁面或者用戶交互就能提供額外的功能。

4.Method

 boolean  javaEnabled () ：返回瀏覽器是否啓用Java。

4.History

1.History是什麼

window.history 對象包含瀏覽器的歷史。

window.history 對象在編寫時可不使用 window 這個前綴。

爲了保護用戶隱私，對 JavaScript 訪問該對象的方法作出了限制。

可對當前頁的瀏覽歷史進行操做，如：前進、後退等。但不能知道瀏覽了哪些URL。

2.如何使用

調用方式：window.history 或者 history。

3.Attribute

 readonly long length ：返回瀏覽器歷史列表中的 URL 數量。

4.Method

 void back () ：當前所屬窗口訪問上一個訪問過的URL。等同於瀏覽器的"後退"按鈕，也等同於history.go(-1)。

 void  forward () ：當前所屬窗口訪問下一個訪問過的URL。等同於瀏覽器的"前進"按鈕，也等同於history.go(1)。

 void  go (int index) ：使當前窗口訪問指定的訪問過的URL。當前窗口訪問過的URL，是存入一個數組。正數表示前進index個(點擊"前進"按鈕index次)，負數表示後退index個(點擊"後退"按鈕index次)。

5.Location

1.Location是什麼

window.location 對象用於得到當前頁面的地址 (URL)，並把瀏覽器重定向到新的頁面。

window.location 對象在編寫時可不使用 window 這個前綴。

2.怎麼使用

調用方式：window.location 或者 location。

3.Attribute

 string hash ：設置或返回當前頁面URL中的的錨部分，包含開頭的#符號。

 string host ：設置或返回當前頁面URL的主機名稱和端口。

 string hostname ：設置或返回當前頁面URL的主機名稱。

 string href ：設置或返回當前頁面完整的URL。若設置時不加協議，設置的字符串只是改變URL最後一個'/'以後的字符串。

 string pathname ：設置或返回當前頁面URL的路徑部分。

 string port ：設置或返回當前頁面URL的端口。若當前URL沒有端口，返回一個''(空字符串)。

 string  protocol ：設置或返回當前頁面URL的協議，最後面會有個':'冒號。

 string  search ：設置或返回當前頁面URL的查詢部分(從問號 (?) 開始的 URL)。

 readonly string  origin ：返回當前頁面URL的源。返回格式：協議+主機名+端口；如：https://www.baidu.com

4.Method

 void  assign (string url) ：設置當前頁面加載指定的url，等同於設置href屬性的值爲url。

 void reload () ：從新加載當前頁面的URL。可當作爲刷新操做。

 void replace (string url) ：設置當前頁面加載指定的url，並在瀏覽器歷史記錄中替換掉當前地址，進行"後退"操做不會顯示當前訪問過的記錄。

 

3.bom與dom的關係與區別

關聯:由於document對象又是DOM（Document Object Model）模型的根節點。能夠說，BOM包含了DOM(對象)，瀏覽器提供出來給予訪問的是BOM對象，從BOM對象再訪問到DOM對象，從而js能夠操做瀏覽器以及瀏覽器讀取到的文檔。

區別:DOM描述了處理網頁內容的方法和接口，BOM描述了與瀏覽器進行交互的方法和接口。

 

轉載：http://www.cnblogs.com/polk6/p/5045277.html