JS判斷移動端訪問設備并加載對應CSS樣式

更新時間：2014年06月13日 10:15:18 投稿：whsnow

JS判斷不同web訪問環(huán)境，主要針對移動設備，提供相對應的解析方案，本例是加載不同的css樣式

JS判斷不同web訪問環(huán)境，主要針對移動設備，提供相對應的解析方案（判斷設備代碼直接copy騰訊網(wǎng)的）

 
// 判斷是否為移動端運行環(huán)境 

if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){ 

if(window.location.href.indexOf("?mobile")<0){ 

try{ 

if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){ 

// 判斷訪問環(huán)境是 Android|webOS|iPhone|iPod|BlackBerry 則加載以下樣式 

setActiveStyleSheet("style_mobile_a.css"); 

} 

else if(/iPad/i.test(navigator.userAgent)){ 

// 判斷訪問環(huán)境是 iPad 則加載以下樣式 

setActiveStyleSheet("style_mobile_iPad.css"); 

} 

else{ 

// 判斷訪問環(huán)境是 其他移動設備 則加載以下樣式 

setActiveStyleSheet("style_mobile_other.css"); 

} 

} 

catch(e){} 

} 

} 

else{ 

// 如果以上都不是，則加載以下樣式 

setActiveStyleSheet("style_mobile_no.css"); 

} 

// 判斷完畢后加載樣式 

function setActiveStyleSheet(filename){document.write("＜link href="+filename+" rel=stylesheet＞");}

加載頁面

復制代碼代碼如下:

 
<script type="text/javascript"> 
if(/AppleWebKit.*mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){ 
if(window.location.href.indexOf("?mobile")<0){ 
try{ 
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){ 
window.location.href="手機頁面"; 
}else if(/iPad/i.test(navigator.userAgent)){ 
window.location.href="平板頁面"; 
}else{ 
window.location.href="其他移動端頁面" 
} 
}catch(e){} 
} 
} 
</script> 

您可能感興趣的文章:

移動端

JS圖像無縫滾動腳本非常好用
最好用的JS圖像無縫滾動腳本，根據(jù)需要改改寬度和圖像個數(shù)就可以了,需要的朋友可以參考下
2014-02-02
JavaScript模擬實現(xiàn)自由落體效果
這篇文章主要為大家詳細介紹了JavaScript模擬實現(xiàn)自由落體效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2018-08-08
基于input框覆蓋掉數(shù)字英文的實例講解
下面小編就為大家?guī)硪黄趇nput框覆蓋掉數(shù)字英文的實例講解。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-07-07
小程序展示彈窗常見API實例詳解
彈窗對我們大家來說應該都不陌生,這篇文章主要給大家介紹了關于小程序展示彈窗常見API的相關資料,主要包括showToast,?showModal,showLoading和showActionSheet,需要的朋友可以參考下
2022-09-09
js實現(xiàn)內(nèi)置計時器
這篇文章主要為大家詳細介紹了js實現(xiàn)內(nèi)置計時器，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-12-12
mapboxgl實現(xiàn)帶箭頭軌跡線的代碼
這篇文章主要介紹了mapboxgl實現(xiàn)帶箭頭軌跡線的代碼,本文給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2021-01-01
JS?中的類Public,Private?和?Protected詳解
這篇文章主要介紹了JS中的類Public,Private和Protected詳解，文章圍繞主題展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下
2022-08-08
干貨分享：讓你分分鐘學會javascript閉包
干貨分享：讓你分分鐘學會javascript閉包，如何才能快速學會javascript閉包，本文為大家揭曉
2015-12-12
IE與Firefox在JavaScript上的7個不同句法分享
盡管那需要用長串的、沉悶的不同分支代碼來應付不同瀏覽器的日子已經(jīng)過去，偶爾還是有必要做一些簡單的區(qū)分和目標檢測來確保某塊代碼能在用戶的機器上正常運行
2011-10-10
JavaScript中文件流的處理場景及方法
作為一名前端開發(fā),我們平時也少不了對文件流數(shù)據(jù)進行處理,今天簡單整理一下日常開發(fā)中比較常見的一些處理文件流的場景及處理方法,希望可以幫助到大家
2023-09-09