浏览器版本的判断————新手上路,请多多指教。

【写在开头】

参考的原文:

http://www.phpernote.com/jquery/829.html

http://www.cnblogs.com/pengjw/p/3439753.html

 http://www.jb51.net/article/25233.htm

最近公司对浏览器的兼容性做了规范。最低的兼容性ie8,但是不需要区分ie8以上版本,前端新手上路,想试一下对浏览器版本的判断。

在搜索的过程中,看到大部分的文章都是几年前的,很多判断方法在更新中已经不再试用。

 

首先想到分别用原生js和jquery两种方法判断浏览器。

原生js:

原生js 多用navigator.userAgent 的返回值来判断。

userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值。

可以看出ie和别的浏览器区别在于关键字MSIE。在ie11中并没有返回MSIE,但是我的需求是在于判断ie8一下浏览器,并提示更换就可以了,所以在对ie的判断中使用window.ActiveXObject,不使用document.all的原因见原文三

 1 <!doctype html>
 2 <head>
 3     <title>浏览器版本测试</title>
 4     <meta charset="utf-8">
 5     <style>
 6     div{
 7         margin: 0 auto;
 8         width: 600px;
 9         margin-top: 20px;
10     }
11     </style>
12 
13 </head>
14 <body>
15     <div>
16         <p>当前使用的浏览器是:<label id="browserVersion"></label></p>
17         <button onclick="test()">查看浏览器版本js</button>
18 
19     </div>
20 <script type="text/javascript">
21 
22 function test(){ 
23     var DEFAULT_VERSION = "8.0"
24     var browser=navigator.userAgent.toLowerCase();
25     alert(browser);
26     if (!!window.ActiveXObject || "ActiveXObject" in window){//判断是否为ie浏览器
27         if(browser.indexOf("msie") >= 0){//ie10 以下返回结果中带有msie
28             var safariVersion   =  browser.match(/msie ([\d.]+)/)[1];
29             if(safariVersion < DEFAULT_VERSION){
30                 document.getElementById('browserVersion').innerHTML="ie8以下,提示更换浏览器"    
31             }else{
32                 document.getElementById('browserVersion').innerHTML="ie8及其以上"    
33             }
34         }else{
35                 document.getElementById('browserVersion').innerHTML="ie8及其以上"    
36         }
37     }else{
38         if(navigator.userAgent.toLowerCase().indexOf('se 2.x')>-1 ? true : false)//基于chrome,先判断搜狗,再判断chrome
39           {
40             document.getElementById('browserVersion').innerHTML="sougou "    
41           }else if(browser.indexOf("firefox") >= 0){
42             document.getElementById('browserVersion').innerHTML="Firefox"    
43         }else if(browser.indexOf("chrome") >= 0){
44             document.getElementById('browserVersion').innerHTML="Chrome"    
45         }else if(browser.indexOf("opera") >= 0){
46             document.getElementById('browserVersion').innerHTML="opera"    
47         }else if(browser.indexOf("safari") >= 0){
48             document.getElementById('browserVersion').innerHTML="Safari"    
49         }
50     }
51 }
52 </script>
53 
54 </body>

其中关于搜狗浏览器的判断,搜狗使用的为chrome内核,所以先判断是否是搜狗浏览器。或者再判断为chrome中再次判断也可以。

 

 

jquery:

搜索到jquery 的$.browser方法,此处敲黑板:$.browser方法在jquery1.9中被替换,现在官方jquery已经3.0了。 取而代之的是 $.support ,在怎么使用的测试中 个人感觉并不如js直接判断直接。

 

敲黑板总结:

新手搜了一些博客,浅显的自己总结了一下,如有错误欢迎指出,如有更好的优化方案,欢迎交流~~

转载于:https://www.cnblogs.com/summ7r/p/6138346.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值