JS判断浏览器版本

JS判断浏览器版本的方法。

主流浏览器的navigator.userAgent

浏览器 userAgent信息
IE 7 Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; WOW64;Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)
IE 8 Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729;Media Center PC 6.0; .NET4.0C; .NET4.0E)
IE 9 Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729;Media Center PC 6.0; .NET4.0C; .NET4.0E)
IE 10 Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)
IE 11 Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; rv:11.0) like Gecko
Edge 17 Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36 Edge/17.17134
Chrome 69 Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36
Firefox 62 Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:62.0) Gecko/20100101 Firefox/62.0
Safari 60 Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0.1 Safari/605.1.15
Opera 56 Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36 OPR/56.0.3051.88

navigator.userAgent主要包含浏览器版本,型号,内核,甚至安装的插件等等。

网页排版引擎大致有2个系列:

  • Internet Explorer核心(Trident)
  • Mozilla Firefox核心(Gecko)

之所以有Gecko标识,跟HTML5规定有关:navigator.appName值为Netscapenavigator.product值为Gecko

在HTML5中要求这两个属性必须返回上述对应的值,这是一个很奇怪的规定的。IE系列中只有Internet Explorer 11遵守了这个规定。我测试了上面列表的浏览器,发现其他主流浏览器(Edge,Chrome,Firefox,Safari,Opera)都遵守了这个规定。

区分IE和其他主流浏览器方法

  1. 根据userAgent包含网页排版引擎区分:Internet Explorer核心(Trident)及Mozilla Firefox核心(Gecko)。代码如下:
1
2
3
function isIE() {
return navigator.userAgent.toLowerCase().indexOf('trident')>-1?true:false;
}
  1. 如果仅仅是区分IE和其他主流浏览器,其实除了userAgent字段外,也可以使用ActiveXObject对象来进行判断。代码如下:
1
2
3
4
5
6
7
function isIE(){
if(!!window.ActiveXObject || "ActiveXObject" in window){
return true;
}else{
return false;
}
}

说明:

  • IE早些版本时,IE10及以下,window.ActiveXObject返回一个对象,!window.ActiveXObject则变为false,!!window.ActiveXObject则为true,因为是或||符号后续无需再判断,返回true。
  • IE11中,window.ActiveXObject返回undefine,!window.ActiveXObject则变成了true,!!window.ActiveXObject则变成了false,进入 "window.ActiveXObject" in window判断,该判断条件在IE11下返回true。
  • 其他非IE浏览器,如chrome,firefox,window.ActiveXObject都是undefine,!!window.ActiveXObject都是返回的false,而 "window.ActiveXObject" in window也是返回false,因此上述判断函数在非IE浏览器中返回的都是false。

判断是否是IE浏览器且给出IE版本

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
function IEVersion() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
if(isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
var fIEVersion = parseFloat(RegExp["$1"]);
if(fIEVersion == 7) {
return 7;
} else if(fIEVersion == 8) {
return 8;
} else if(fIEVersion == 9) {
return 9;
} else if(fIEVersion == 10) {
return 10;
} else {
return 6;//IE版本<=7
}
} else if(isEdge) {
return 'edge';//edge
} else if(isIE11) {
return 11; //IE11
}else{
return -1;//不是ie浏览器
}
}

判断主流浏览器版本

判断非IE类浏览器时,Chrome浏览器不能直接用navigator.userAgent.indexOf('Chrome')>-1直接判断,因为Edge和Opera的浏览器信息都含有Chrome字符。代码如下:

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
33
34
35
36
37
38
39
40
function browserVersion() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //Edge浏览器
var isFirefox = userAgent.indexOf("Firefox") > -1; //Firefox浏览器
var isOpera = userAgent.indexOf("Opera")>-1 || userAgent.indexOf("OPR")>-1 ; //Opera浏览器
var isChrome = userAgent.indexOf("Chrome")>-1 && userAgent.indexOf("Safari")>-1 && userAgent.indexOf("Edge")==-1 && userAgent.indexOf("OPR")==-1; //Chrome浏览器
var isSafari = userAgent.indexOf("Safari")>-1 && userAgent.indexOf("Chrome")==-1 && userAgent.indexOf("Edge")==-1 && userAgent.indexOf("OPR")==-1; //Safari浏览器
if(isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
var fIEVersion = parseFloat(RegExp["$1"]);
if(fIEVersion == 7) {
return 'IE7';
} else if(fIEVersion == 8) {
return 'IE8';
} else if(fIEVersion == 9) {
return 'IE9';
} else if(fIEVersion == 10) {
return 'IE10';
} else {
return 'IE6';//IE版本<7
}
} else if(isIE11) {
return 'IE11';
} else if(isEdge) {
return 'Edge'+userAgent.split('Edge/')[1].split('.')[0];
} else if(isFirefox) {
return 'Firefox'+userAgent.split('Firefox/')[1].split('.')[0];
} else if(isOpera) {
return 'Opera'+userAgent.split('OPR/')[1].split('.')[0];
} else if(isChrome) {
return 'Chrome'+userAgent.split('Chrome/')[1].split('.')[0];
} else if(isSafari) {
return 'Safari';+userAgent.split('Safari/')[1].split('.')[0];
} else{
return -1;
}
}

本文转载于:js判断主流浏览器版本


----------- 本文结束啦感谢您阅读 -----------

赞赏一杯咖啡

欢迎关注我的其它发布渠道