js如何判断浏览器版本

Bertha 。 2021-06-12 20:36 884阅读 0赞

# 获取浏览器版本信息 #

调用navigator对象的userAgent属性可以获取到浏览器版本，型号，内核，甚至安装的插件等信息。

navigator.userAgent

# 主流浏览器的userAgent信息 #

一些主流浏览器的部分版本userAgent信息如下表所示：

<table> 
 <thead> 
  <tr> 
   <th>浏览器及版本</th> 
   <th>userAgent信息</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>IE7</td> 
   <td>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)</td> 
  </tr> 
  <tr> 
   <td>IE8</td> 
   <td>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)</td> 
  </tr> 
  <tr> 
   <td>IE9</td> 
   <td>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)</td> 
  </tr> 
  <tr> 
   <td>IE11</td> 
   <td>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</td> 
  </tr> 
  <tr> 
   <td>Edge 17</td> 
   <td>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</td> 
  </tr> 
  <tr> 
   <td>Chrome 69</td> 
   <td>Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36</td> 
  </tr> 
  <tr> 
   <td>Firefox 62</td> 
   <td>Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:62.0) Gecko/20100101 Firefox/62.0</td> 
  </tr> 
  <tr> 
   <td>Safari 60</td> 
   <td>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</td> 
  </tr> 
  <tr> 
   <td>Opera 56</td> 
   <td>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</td> 
  </tr> 
 </tbody> 
</table>

# 判断浏览器是否是IE #

可以通过ActiveXObject对象来判断当前浏览器是否是IE浏览器。

if(!!window.ActiveXObject || "ActiveXObject" in window){
      return true;
    }else{
      return false;
    }

如上述代码所示，只有在IE浏览器下，`window.ActiveXObject`会返回一个对象，`!window.ActiveXObject`会返回false，`!!window.ActiveXObject`则返回true，但是在IE11版本下，`window.ActiveXObject`会返回undefined，导致前面两个表达式返回的结果正好相反，因此就需要再增加一个判断，`"ActiveXObject" in window`在IE11版本下返回true，从而使得条件依然满足。  
在非IE浏览器下，上述条件将返回false，因为`window.ActiveXObject`会返回undefined且`"ActiveXObject" in window`也会返回false。

# 判断主流浏览器版本 #

判断主流浏览器版本的思路其实就是使用`navigator.userAgent`获取到userAgent信息，然后对userAgent信息使用正则表达式进行匹配判断。话不多说，直接上代码。