通過JS判斷網(wǎng)頁是否為手機打開
參考一:
//返回true表示為pc端打開,返回false表示為手機端打開
function check() {
var userAgentInfo=navigator.userAgent;
var Agents =new Array("Android","iPhone","SymbianOS","Windows Phone","iPad","iPod");
var flag=true;
for(var v=0;v<Agents.length;v++) {
if(userAgentInfo.indexOf(Agents[v])>0) {
flag=false;
break;
}
}
return flag;
}
參考二:
簡單的利用 JS 來判斷頁面是在手機端還是在 PC 端打開的方法(轉(zhuǎn))
在移動設(shè)備應(yīng)用越來越廣泛的今天,許多網(wǎng)站都開始做移動端的界面展示,兩者屏幕尺寸差異很大,所以展示的內(nèi)容也有所差別。于是就遇到一個問題,如何判斷你的頁面是在移動端還是在PC端打開的,很簡單的問題,那我們就簡單點來說,以我們公司的官網(wǎng)來說,PC端和移動端的官網(wǎng)界面分別如下:

PC

手機
Navigator對象
首先來了解一下Navigator 對象,Navigator 對象包含有關(guān)瀏覽器的信息,下面的userAgent 屬性是一個只讀的字符串,聲明了瀏覽器用于 HTTP 請求的用戶代理頭的值。所以我們可以通過判斷navigator.useragent里面是否有某些值來判斷,比如我的電腦是mac,所以打印出來的值為
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36
具體含義不解釋,有興趣同學自行百度,可以看到里面含有 Mac 字樣,其他的也是類似的。
那如何判斷頁面是在移動端還是PC端打開的呢?
網(wǎng)上有很多方法,寫的或難或簡單,實際上一行代碼就夠了
window.location.href = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ? "https://www.baidu.com/" : http://news.baidu.com/;
以上代碼利用了 正則表達式 和 三目運算符,含義就是如果是移動端打開的話那就跳轉(zhuǎn)到 https://www.baidu.com/,如果不是就跳轉(zhuǎn)到 http://new.baidu.com/,這個看不懂的話,那我下面這樣寫就很容易理解了吧
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
window.location.;
} else {
window.location.;
}
什么?if 里面的判斷還是看不懂?實際上就是利用正則去判斷 navigator.useragent 是否含有 Android/webOs/iphone 等字符串,并且利用修飾符 " i " 做了不區(qū)分大小寫,然后用正則的方法 test 去判斷是否滿足,如果這種方式不理解的話完全可以利用字符串的 indexOf 方法去判斷。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- js如何判斷是否在iframe中及防止網(wǎng)頁被別站用iframe嵌套
- JS實現(xiàn)點擊網(wǎng)頁判斷是否安裝app并打開否則跳轉(zhuǎn)app store
- javascript判斷網(wǎng)頁是關(guān)閉還是刷新
- JS判斷網(wǎng)頁廣告是否被瀏覽器攔截過濾的代碼
- js判斷當頁面無法回退時關(guān)閉網(wǎng)頁否則就history.go(-1)
- javascript判斷是手機還是電腦訪問網(wǎng)頁的簡單實例分享
- javascript獲取和判斷瀏覽器窗口、屏幕、網(wǎng)頁的高度、寬度等
- 借助javascript代碼判斷網(wǎng)頁是靜態(tài)還是偽靜態(tài)
- js判斷是否是移動設(shè)備登陸網(wǎng)頁的簡單方法
相關(guān)文章
echarts中X軸顯示特定個數(shù)label并修改樣式的方法詳解
最近在使用Echarts圖表遇到些特別的需求,想著給大家整理下,所以下面這篇文章主要給大家介紹了關(guān)于echarts中X軸顯示特定個數(shù)label并修改樣式的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-07-07
JS寫XSS cookie stealer來竊取密碼的步驟詳解
JavaScript是web中最常用的腳本開發(fā)語言,js可以自動執(zhí)行站點組件,管理站點內(nèi)容,在web業(yè)內(nèi)實現(xiàn)其他有用的函數(shù)。這篇文章主要介紹了JS寫XSS cookie stealer來竊取密碼的步驟詳解,需要的朋友可以參考下2017-11-11
JS實現(xiàn)雙擊內(nèi)容變?yōu)榭删庉嫚顟B(tài)
在一些網(wǎng)站上我們經(jīng)??吹浇换バ院軓姷墓δ?。一些用戶資料可以直接雙擊出現(xiàn)文本框,并在此輸入新的資料即可修改,無需再按確定按鈕等。怎么實現(xiàn)的呢?今天小編給大家分享JS實現(xiàn)雙擊內(nèi)容變?yōu)榭删庉嫚顟B(tài),需要的的朋友參考下2017-03-03
JavaScript+canvas實現(xiàn)五子棋游戲
這篇文章主要為大家詳細介紹了JavaScript+canvas實現(xiàn)五子棋游戲,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-05-05

