學過前端開發的地球人應該都了解,JavaScript分為三個部分:ECMAScript(JS語言本身基礎語法),DOM(文檔物件模型,應用程式介面),BOM(瀏覽器物件模型)。
BOM,實際上與瀏覽器有關係。因此瀏覽器廠商可以依照各自的想法隨意去擴充(基於window物件的擴充)。不過,擴充歸擴展,每個瀏覽器之間都遵循著一套標準。學習BOM對於理解JS這門語言仍然是很重要的,因此不能忽視。以下是我的一些總結,給出一些常用方法。並不會細說每個方法如何使用,這篇文章的主要目的,就是希望BOM在我們腦中形成一個簡單的框架。知道一些常用的方法,在遇到問題的時候可以追本溯源。
BOM中存在五個物件:
window物件(核心物件)
location物件(即是window對象的屬性,又是document物件的屬性)
navigator物件
history物件:至今未使用過
#screen物件:至今未使用過
每個物件下都存在一些屬性和方法,下面列出幾種常見和常使用的方法,同時給出簡單的說明。
window物件(核心物件)的常見方法
#非同步:XMLHttpRequest建構子
- #Number資料型態:Number, parseInt, parseFloat, isNaN, isFinite
- 定時器:setTimeout, setInterval。這裡想說明的是,setTimeout中回呼函數中的this會指向window對象,原因其實很簡單。在回調函數作為參數傳遞給了setTimout, 此時發生this的隱式賦值遺失。還有一個要注意的是setTimeout的執行順序問題。
- url加密:encodeURI, encodeURIComponent方法
- url解密:decodeURI, decodeURIComponent方法
視窗尺寸:(innerWidth, innerHeight) (outerWidth, outerHeight),這裡要與DOM中的client dimension和offset dimension區分開來,也就是clientWidth(Height) 和offsetWidth(Height)
#視窗位置:(screenLeft, screenRight) (screenX, screenY) 開啟新視窗: open方法,此方法可接收三個參數-
系統對話框:alert, confirm, prompt方法
- #location物件
href屬性:取得url位址, (也可以透過此屬性設定url位址)
protocal屬性:傳回頁面使用的協定, (也可以透過此屬性設定protocal)
- host屬性:傳回伺服器名稱和連接埠號,既包含hostname + port. (也可以透過此屬性設定host)
hostname屬性:傳回不含連接埠號碼的伺服器名稱, (也可以透過此屬性設定hostname) port屬性:返回連接埠號碼, (也可以透過此屬性設定port)
#### ##pathname屬性:傳回url目錄或檔案名稱, (也可以透過此屬性設定pathname)#############hash屬性:傳回url中的hash(#content), (也可以透過此屬性設定hash)############search屬性:query string(如?name=keith&height=180), (也可以透過此屬性設定search)########## ###reload方法:頁面以最有效的方式載入。也就是說,如果頁面自上次請求以來並沒有改變過,頁面就會從瀏覽器快取中載入。如果要強制從瀏覽器重新載入,可以傳遞一個true的布林值。 ###############navigator物件################userAgent:使用者代理,查詢使用者使用的瀏覽器資訊。在行動端上可用來判斷使用者使用的是哪種類型的行動裝置或瀏覽器#############
以上是BOM中存在的五個物件介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!