判斷原理：
JavaScript是前端開發的主要語言，我們可以通過 編寫JavaScript程序來判斷瀏覽器的類型及版本。JavaScript判斷瀏覽器類型一般有兩種辦法，一種是根據各種瀏覽器獨有的屬性來分辨，另 一種是通過分析瀏覽器的userAgent屬性來判斷的。在許多情況下，值判斷出瀏覽器類型之后，還需判斷瀏覽器版本才能處理兼容性問題，而判斷瀏覽器的 版本一般只能通過分析瀏覽器的userAgent才能知道。
瀏覽器類型
⑴瀏覽器特有屬性
⑵根據userAgent
瀏覽器版本
⑴根據userAgent
對於手機瀏覽器判斷
1.如何判斷是否為移動終端 利用正則match，
匹配navigator.userAgent是否含有字符串AppleWebKit*****Mobile
安卓qq瀏覽器HD版 只有AppleWebKit
2手機語言版本的判斷
使用navigator.browserLanguage 便可得出windows phone語言版本，
當然可惡的小小手機語言版本也有兼容性的差異，兼容Mozilla，以及AppleWebKit內核的瀏覽器訪問其語言版本，它會列出 navigator.language
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
<script type=
"text/javascript"
>
/*
* 智能機瀏覽器版本信息:
*
*/
var
browser={
versions:
function
(){
var
u = navigator.userAgent, app = navigator.appVersion;
return
{
//移動終端瀏覽器版本信息
trident: u.indexOf(
'Trident'
) > -1,
//IE內核
presto: u.indexOf(
'Presto'
) > -1,
//opera內核
webKit: u.indexOf(
'AppleWebKit'
) > -1,
//蘋果、谷歌內核
gecko: u.indexOf(
'Gecko'
) > -1 && u.indexOf(
'KHTML'
) == -1,
//火狐內核
mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/),
//是否為移動終端
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 || u.indexOf(
'Mac'
) > -1,
//是否為iPhone或者QQHD瀏覽器
iPad: u.indexOf(
'iPad'
) > -1,
//是否iPad
webApp: u.indexOf(
'Safari'
) == -1
//是否web應該程序，沒有頭部與底部
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
document.writeln(
"語言版本: "
+browser.language);
document.writeln(
" 是否為移動終端: "
+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瀏覽器沒有安卓報頭，只返回：linux ，這里粗略的根據linux來判斷是安卓（前提必須滿足是移動終端，UC這點是滿足的）
安卓QQ瀏覽器HD版檢測的結果是：mac， Safari，這個很是變態，自己看着處理吧
3個檢測瀏覽器User-Agent信息的網站
三個在線網站，通過手機瀏覽器就可以在線檢測，很是方便
參考文章：
Pc瀏覽器
http://www.jb51.net/article/17302.htm
http://www.bairuiw.com/front-end-skill/1346.html
手機瀏覽器
http://www.iundefined.com/development/344.html
http://www.cnblogs.com/dowinning/archive/2011/07/22/2113747.html
http://www.cnblogs.com/dowinning/archive/2011/07/22/2113981.html
http://luckerme.com/archives/1015.html
原文：