js判斷客戶端是iOS還是Android等移動(dòng)終端的方法
判斷原理
JavaScript是前端開發(fā)的主要語言,我們可以通過編寫JavaScript程序來判斷瀏覽器的類型及版本。JavaScript判斷瀏覽器類型一般有兩種辦法,一種是根據(jù)各種瀏覽器獨(dú)有的屬性來分辨,另一種是通過分析瀏覽器的userAgent屬性來判斷的。在許多情況下,值判斷出瀏覽器類型之后,還需判斷瀏覽器版本才能處理兼容性問題,而判斷瀏覽器的版本一般只能通過分析瀏覽器的userAgent才能知道。
瀏覽器類型
⑴瀏覽器特有屬性
⑵根據(jù)userAgent
瀏覽器版本
⑴根據(jù)userAgent
對(duì)于手機(jī)瀏覽器判斷
1.如何判斷是否為移動(dòng)終端 利用正則match,
匹配navigator.userAgent是否含有字符串AppleWebKit*****Mobile
安卓qq瀏覽器HD版 只有AppleWebKit
2手機(jī)語言版本的判斷
使用navigator.browserLanguage 便可得出windows phone語言版本,
當(dāng)然可惡的小小手機(jī)語言版本也有兼容性的差異,兼容Mozilla,以及AppleWebKit內(nèi)核的瀏覽器訪問其語言版本,它會(huì)列出 navigator.language
<script type="text/javascript">
var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return { //移動(dòng)終端瀏覽器版本信息
trident: u.indexOf('Trident') > -1, //IE內(nèi)核
presto: u.indexOf('Presto') > -1, //opera內(nèi)核
webKit: u.indexOf('AppleWebKit') > -1, //蘋果、谷歌內(nèi)核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐內(nèi)核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否為移動(dòng)終端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android終端或uc瀏覽器
iPhone: u.indexOf('iPhone') > -1 , //是否為iPhone或者QQHD瀏覽器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1 //是否web應(yīng)該程序,沒有頭部與底部
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
document.writeln("語言版本: "+browser.language);
document.writeln(" 是否為移動(dòng)終端: "+browser.versions.mobile);
document.writeln(" ios終端: "+browser.versions.ios);
document.writeln(" android終端: "+browser.versions.android);
document.writeln(" 是否為iPhone: "+browser.versions.iPhone);
document.writeln(" 是否iPad: "+browser.versions.iPad);
document.writeln(navigator.userAgent);
</script>
比較特別的地方
UC瀏覽器沒有安卓報(bào)頭,只返回:linux ,這里粗略的根據(jù)linux來判斷是安卓(前提必須滿足是移動(dòng)終端,UC這點(diǎn)是滿足的)
安卓QQ瀏覽器HD版檢測(cè)的結(jié)果是:mac, Safari
檢測(cè)瀏覽器語言:
currentLang = navigator.language; //判斷除IE外其他瀏覽器使用語言
if(!currentLang){//判斷IE瀏覽器使用語言
currentLang = navigator.browserLanguage;
}
alert(currentLang);
js 判斷iPhone|iPad|iPod|iOS|Android客戶端
if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
//alert(navigator.userAgent);
window.location.href ="iPhone.html";
} else if (/(Android)/i.test(navigator.userAgent)) {
//alert(navigator.userAgent);
window.location.href ="Android.html";
} else {
window.location.href ="pc.html";
};
以上代碼已經(jīng)調(diào)整,可以放心使用,若有問題,歡迎指出。
- Android實(shí)現(xiàn)拖動(dòng)小球跟隨手指移動(dòng)效果
- Android實(shí)現(xiàn)移動(dòng)小球和CircularReveal頁面切換動(dòng)畫實(shí)例代碼
- Android自定義控件實(shí)現(xiàn)隨手指移動(dòng)的小球
- Android View移動(dòng)的六種方法小結(jié)
- Android中利用matrix 控制圖片的旋轉(zhuǎn)、縮放、移動(dòng)
- android實(shí)現(xiàn)關(guān)閉或開啟移動(dòng)網(wǎng)絡(luò)數(shù)據(jù)
- Android實(shí)現(xiàn)循環(huán)平移動(dòng)畫示例
- Android自定義圓形View實(shí)現(xiàn)小球跟隨手指移動(dòng)效果
相關(guān)文章
前端排查內(nèi)存泄漏的方法及實(shí)戰(zhàn)案例
內(nèi)存泄漏是指在程序運(yùn)行時(shí),分配的內(nèi)存沒有被正確釋放,導(dǎo)致內(nèi)存空間的浪費(fèi),最終可能會(huì)導(dǎo)致程序崩潰或運(yùn)行緩慢,這篇文章主要介紹了前端排查內(nèi)存泄漏的相關(guān)資料,需要的朋友可以參考下2025-03-03
js對(duì)象數(shù)組根據(jù)對(duì)象屬性刪除對(duì)象
這篇文章主要介紹了js對(duì)象數(shù)組根據(jù)對(duì)象屬性刪除對(duì)象,需要的朋友可以參考下2023-07-07
JavaScript switch case 的用法實(shí)例[范圍]
JavaScript switch case 的用法實(shí)例,大家可以參考下。2009-09-09
IE6背景圖片不緩存問題解決方案及圖片使用策略多個(gè)方法小結(jié)
最近發(fā)現(xiàn)的Web項(xiàng)目在IE6下出現(xiàn)背景圖片不緩存的問題,在網(wǎng)上搜索了一番,發(fā)現(xiàn)已經(jīng)是眾所周知的BUG,這里就總結(jié)一下各種解決辦法2012-05-05
uniapp原生tabbar設(shè)置并添加數(shù)字角標(biāo)或小紅點(diǎn)提示功能
這篇文章主要給大家介紹了關(guān)于uniapp原生tabbar設(shè)置并添加數(shù)字角標(biāo)或小紅點(diǎn)提示功能的相關(guān)資料,在相應(yīng)的頁面中完成對(duì)消息的處理,如果有新消息,則在tabBar頁面中顯示紅點(diǎn)提醒用戶,需要的朋友可以參考下2023-08-08

