第10章 JS-Web-API-BOM【內容雖然不多,但是你不能不會】

返回章節目錄

目錄

location和history

總結:

如何識別瀏覽器類型?

如何拆解url各個部分?


 

navigator和screen

navigator

navigator.userAgent就是獲取瀏覽器的類型,這個屬性有什麼用?

據說世界上還有近百種瀏覽器。通常在開發的時候要做到兼容各種瀏覽器,因此判斷瀏覽器類型及系統是很重要的,總不能在A瀏覽器能顯示,在B瀏覽器就顯示不了吧?

舉幾個例子來看看,在qq瀏覽器中,有特定的QQBrowser字符串

在chrome中

在firefox中

在safari中

 

screen就不多說了,主要獲取屏幕的寬和高,screen一般其實不用,可能存在兼容性問題,如果是響應式設置,screen.width獲取視口的寬度,如果是PC端,獲取的實際是橫向分辨率。如果要獲取視口的寬度,可以這樣做

var viewWidth = document.documentElement.clientWidth || window.innerWidth

 

location和history

location

url如下,我們來試一下

https://coding.imooc.com/class/chapter/400.html?a=100&b=200#Anchor
// 這個?a=100&b=200是我自己加的,不影響訪問,方便觀察結果

history

history.back(); // 瀏覽器後退

history.forward();// 瀏覽器前進


對應着瀏覽器的後退和前進

 

總結:

如何識別瀏覽器類型?

具體見上面的例子

如何拆解url各個部分?

 

 

關注、留言,我們一起學習。

 

===============Talk is cheap, show me the code================

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章