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

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

開(kāi)發(fā)工具與關(guān)鍵技術(shù)：Adobe Dreamweaver JavaScript

作者：陳鈺桃

撰寫(xiě)時(shí)間：2020年4月28日

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

一、什么是BOM？

????? - BOM：瀏覽器對(duì)象模型 //宿主對(duì)象

?????? ? - BOM 提供了很多對(duì)象，用于訪(fǎng)問(wèn)瀏覽器的功能，這些功能與任何網(wǎng)頁(yè)內(nèi)容無(wú)關(guān)。

?????? ? - BOM將瀏覽器中的各個(gè)部分轉(zhuǎn)換成一個(gè)一個(gè)的對(duì)象，我們通過(guò)修改這些對(duì)象的屬性，調(diào)用他們的方法，從而控制瀏覽器的各種行為

?????? ?

?????? ? 簡(jiǎn)單來(lái)說(shuō)：BOM可以使我們通過(guò)JS來(lái)操作瀏覽器，在BOM中提供了一組對(duì)象，用來(lái)完成瀏覽器的操作。

?????? ? BOM對(duì)象

?????? ? 1.Window對(duì)象

?????? ??????? - 代表的是整個(gè)瀏覽器窗口，同時(shí)window也是網(wǎng)頁(yè)中全局對(duì)象

?????? ? 2.Navigator對(duì)象 (網(wǎng)景公司)

?????? ??? ????- 代表的當(dāng)前瀏覽器的信息，通過(guò)該對(duì)象可以來(lái)識(shí)別不同的瀏覽器

?????? ? 3.Location

?????? ??????? - 代表當(dāng)前瀏覽器的地址欄信息，通過(guò)Location可以獲取地址欄信息，或則操作瀏覽器頁(yè)面跳轉(zhuǎn)

?????? ? 4.History

?????? ??????? - 代表瀏覽器的歷史記錄，可以通過(guò)該對(duì)象來(lái)操作瀏覽器的歷史記錄，由于隱私問(wèn)題，該對(duì)象不能獲取到具體的歷史記錄，只能操作瀏覽器向前或向后翻頁(yè)，而且該操作只在當(dāng)次訪(fǎng)問(wèn)時(shí)有效

?????? ? 5.Screen

?????? ??????? - 代表用戶(hù)的屏幕的信息，通過(guò)該對(duì)象可以獲取到用戶(hù)的顯示器的相關(guān)的信息

????????????????????

?????? ?這些BOM對(duì)象在瀏覽器中都是作為window對(duì)象的屬性保存

?????? ???? 可以通過(guò)window對(duì)象來(lái)使用，也可以直接使用

二、Navigator

?????? ??? - 代表當(dāng)前瀏覽器的信息，通過(guò)對(duì)象可以來(lái)識(shí)別不同的瀏覽器

????????????? - 由于歷史原因，Navigator對(duì)象中的部分屬性都是不能幫助我們識(shí)別瀏覽器了

????????????? - 一般我們只會(huì)使用userAgent來(lái)判斷瀏覽器的信息

????????????? ? userAgent是一個(gè)字符串，這個(gè)字符串中包含用來(lái)描述瀏覽器信息的內(nèi)容，不同的瀏覽器會(huì)有不通過(guò)的userAgent

????????????? firefox中的userAgent

????????????? ?? Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:72.0)??

????????????? ?? Gecko/20100101 Firefox/72.0

????????????? Chrome中的userAgent

????????????? ?? Mozilla/5.0 (Window NT 10.0; Win64; x64)

????????????? ?? AppleWebKit/537.36 (KHTML, like Gecko)

????????????? ?? Chrome/81.0.4000.3 Safari/537.36

????????????? IE8 中的userAgent

????????????? ?? Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 10.0;WOW64;Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 3.5.30729;InfoPath.3)

????????????? IE9 中的userAgent

????????????? ?? Mozilla/5.0 (compatible; MSIE 9.0; Windows 10.0; WOW64; Trident/7.0; .NET4.0C; .NETC.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; InfoPath.3)

????????????? IE10 中的userAgent

????????????? ?? Mozilla/5.0 (Windows NT 10.0;WOW64; Trident/7.0; .NET4.0C;.NET4.0E; .NET CLR 2.0.50727; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.0.30729; .NET CLR 3.5.30729; InfoPath.3)

????????????? IE11 中的userAgent

?????? ?????? Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; InfoPath.3; rv:11.0) like Gecko

如果通過(guò)navigator.userAgent不能判斷，還可以通過(guò)一些瀏覽器中特有的對(duì)象，來(lái)判斷瀏覽器信息

?????? ?? 比如：ActiveXObject

三、History

?????? ??? - 對(duì)象可以用來(lái)操作瀏覽器向前或向后翻頁(yè)

????????????? - length 返回瀏覽器歷史列表中的 UPL 數(shù)量。

History 對(duì)象方法

?????? ?? 方法 描述

?????? ?? back() 加載 history 列表中的前一個(gè) URL。

?????? ?? forward() 加載 history 列表中的下一個(gè) URL。

?????? ?? go() 加載 history 列表中的某個(gè)具體頁(yè)面。

?????? ??

?????? ?? go(-1) ==>back()

?????? ?? go(1)? ==>forward()

四、Location

?????? ?? - 該對(duì)象中封裝了瀏覽器的地址欄的信息

Location 對(duì)象屬性

?????? 屬性 描述

?????? hash 設(shè)置或返回從井號(hào) (#) 開(kāi)始的 URL (錨) 。

?????? host 設(shè)置或返回主機(jī)名和當(dāng)前 URL 的端口號(hào)。

?????? hostname 設(shè)置或返回當(dāng)前 URL? 的主機(jī)名。

?????? href 設(shè)置或返回完整的 URL。

?????? pathname 設(shè)置或返回 URL 的路徑部分。

?????? port 設(shè)置或返回當(dāng)前 URL 的端口號(hào)。

?????? protocol 設(shè)置或返回當(dāng)前 URL 的協(xié)議。

?????? search 設(shè)置或返回從問(wèn)好 (?) 開(kāi)始的 URL (查詢(xún)部分)。

assign()

???????????????????? ??? - 用來(lái)跳轉(zhuǎn)到其他的頁(yè)面，作用和直接修改location一樣

reload()

???????????????????? ???? - 重新加載當(dāng)前文檔，作用和刷新按鈕一樣

??????????????????????????? ?- 如果在方法中傳遞一個(gè)ture作為參數(shù)，則會(huì)強(qiáng)制清空緩存刷新頁(yè)面

replace()

???????????????????? ????? - 用新的文檔替換當(dāng)前文檔，調(diào)用完畢也會(huì)跳轉(zhuǎn)頁(yè)面

??????????????????????????? ???? - 不會(huì)生成歷史記錄，不能使用回退按鈕回退

總結(jié)

以上是生活随笔為你收集整理的JavaScript浏览器对象模型BOM的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。