编程 Javascript

jquery判断当前浏览器的实现代码

Posted in Javascript onNovember 07, 2015

写了一个判断当前浏览器类型及版本的方法，只在IE 8/11 、谷歌、360 浏览器（不完全）上测试过，需要用到jquery

核心代码：

;(function($, window, document,undefined){
  if(!window.browser){
     
    var userAgent = navigator.userAgent.toLowerCase(),uaMatch;
    window.browser = {}
     
    /**
     * 判断是否为ie
     */
    function isIE(){
      return ("ActiveXObject" in window);
    }
    /**
     * 判断是否为谷歌浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/chrome\/([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'chrome';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 判断是否为火狐浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/firefox\/([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'firefox';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 判断是否为opera浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/opera.([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'opera';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 判断是否为Safari浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/safari\/([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'safari';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 最后判断是否为IE
     */
    if(!uaMatch){
      if(userAgent.match(/msie ([\d.]+)/)!=null){
        uaMatch = userAgent.match(/msie ([\d.]+)/);
        window.browser['name'] = 'ie';
        window.browser['version'] = uaMatch[1];
      }else{
        /**
         * IE10
         */
        if(isIE() && !!document.attachEvent && (function(){"use strict";return !this;}())){
          window.browser['name'] = 'ie';
          window.browser['version'] = '10';
        }
        /**
         * IE11
         */
        if(isIE() && !document.attachEvent){
          window.browser['name'] = 'ie';
          window.browser['version'] = '11';
        }
      }
    }
 
    /**
     * 注册判断方法
     */
    if(!$.isIE){
      $.extend({
        isIE:function(){
          return (window.browser.name == 'ie');
        }
      });
    }
    if(!$.isChrome){
      $.extend({
        isChrome:function(){
          return (window.browser.name == 'chrome');
        }
      });
    }
    if(!$.isFirefox){
      $.extend({
        isFirefox:function(){
          return (window.browser.name == 'firefox');
        }
      });
    }
    if(!$.isOpera){
      $.extend({
        isOpera:function(){
          return (window.browser.name == 'opera');
        }
      });
    }
    if(!$.isSafari){
      $.extend({
        isSafari:function(){
          return (window.browser.name == 'safari');
        }
      });
    }
  }
})(jQuery, window, document);

使用方法：

//使用方式
console.log(window.browser);
console.log($.isIE());
console.log($.isChrome());

三水点靠木小编特提供的完整测试代码：

<html> 
<head> 
<title>jquery 浏览器判断</title> 
</head> 
<body> 
<script src="http://demo.3water.com/jslib/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript"> 
(function($, window, document,undefined){
  if(!window.browser){
     
    var userAgent = navigator.userAgent.toLowerCase(),uaMatch;
    window.browser = {}
     
    /**
     * 判断是否为ie
     */
    function isIE(){
      return ("ActiveXObject" in window);
    }
    /**
     * 判断是否为谷歌浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/chrome\/([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'chrome';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 判断是否为火狐浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/firefox\/([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'firefox';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 判断是否为opera浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/opera.([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'opera';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 判断是否为Safari浏览器
     */
    if(!uaMatch){
      uaMatch = userAgent.match(/safari\/([\d.]+)/);
      if(uaMatch!=null){
        window.browser['name'] = 'safari';
        window.browser['version'] = uaMatch[1];
      }
    }
    /**
     * 最后判断是否为IE
     */
    if(!uaMatch){
      if(userAgent.match(/msie ([\d.]+)/)!=null){
        uaMatch = userAgent.match(/msie ([\d.]+)/);
        window.browser['name'] = 'ie';
        window.browser['version'] = uaMatch[1];
      }else{
        /**
         * IE10
         */
        if(isIE() && !!document.attachEvent && (function(){"use strict";return !this;}())){
          window.browser['name'] = 'ie';
          window.browser['version'] = '10';
        }
        /**
         * IE11
         */
        if(isIE() && !document.attachEvent){
          window.browser['name'] = 'ie';
          window.browser['version'] = '11';
        }
      }
    }
 
    /**
     * 注册判断方法
     */
    if(!$.isIE){
      $.extend({
        isIE:function(){
          return (window.browser.name == 'ie');
        }
      });
    }
    if(!$.isChrome){
      $.extend({
        isChrome:function(){
          return (window.browser.name == 'chrome');
        }
      });
    }
    if(!$.isFirefox){
      $.extend({
        isFirefox:function(){
          return (window.browser.name == 'firefox');
        }
      });
    }
    if(!$.isOpera){
      $.extend({
        isOpera:function(){
          return (window.browser.name == 'opera');
        }
      });
    }
    if(!$.isSafari){
      $.extend({
        isSafari:function(){
          return (window.browser.name == 'safari');
        }
      });
    }
  }
})(jQuery, window, document);
//使用方式
alert(window.browser.name);
//下面是ie F2中测试可以看到效果
console.log(window.browser);
console.log($.isIE());
console.log($.isChrome());
</script> 
</body> 
</html>

jquery判断当前浏览器的实现代码

- Author -

mdxy-dxy

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript之appendChild、insertBefore和insertAfter使用说明

Dec 30 Javascript

jquery动画1.加载指示器

Aug 24 Javascript

javascript跨浏览器的属性判断方法

Mar 16 Javascript

node.js中的querystring.unescape方法使用说明

Dec 10 Javascript

jQuery实现表格展开与折叠的方法

May 04 Javascript

Easyui Treegrid改变默认图标的方法

Apr 29 Javascript

Vue.js对象转换实例

Jun 07 Javascript

微信小程序组件 marquee实例详解

Jun 23 Javascript

Vue瀑布流插件的使用示例

Sep 19 Javascript

详解Puppeteer前端自动化测试实践

Feb 21 Javascript

JavaScript碎片—函数闭包（模拟面向对象）

Mar 13 Javascript

详解VS Code使用之Vue工程配置format代码格式化

Mar 20 Javascript

jQuery插件开发精品教程(让你的jQuery更上一个台阶)

Nov 07 #Javascript

js识别uc浏览器的代码

Nov 06 #Javascript

详解javascript数组去重问题

Nov 06 #Javascript

基于JavaScript实现仿京东图片轮播效果

Nov 06 #Javascript

实现非常简单的js双向数据绑定

Nov 06 #Javascript

浅析javascript中的事件代理

Nov 06 #Javascript

详解javascript中的事件处理

Nov 06 #Javascript

You might like

PHP 数组实例说明

2008/08/18 PHP

PHP中实现生成静态文件的方法缓解服务器压力

2014/01/07 PHP

PHP连接sql server 2005环境配置及问题解决

2014/08/08 PHP

thinkphp5 URL和路由的功能详解与实例

2017/12/26 PHP

php数组和链表的区别总结

2019/09/20 PHP

Track Image Loading效果代码分析

2007/08/13 Javascript

JavaScript中的私有/静态属性介绍

2012/07/26 Javascript

js左侧三级菜单导航实例代码

2013/09/13 Javascript

js实现顶部可折叠的菜单工具栏效果实例

2015/05/09 Javascript

jQuery的层级查找方式分析

2016/06/16 Javascript

jquery删除table当前行的实例代码

2016/10/07 Javascript

JS生成和下载二维码的代码

2016/12/07 Javascript

jQuery为DOM动态追加事件的方法

2017/02/16 Javascript

微信小程序 template模板详解及实例代码

2017/03/09 Javascript

浅谈gulp创建完整的项目流程

2017/12/20 Javascript

CentOS环境中MySQL修改root密码方法

2018/01/07 Javascript

利用SpringMVC过滤器解决vue跨域请求的问题

2018/02/10 Javascript

微信小程序实现图片上传放大预览删除代码

2020/06/28 Javascript

如何解决vue在ios微信"复制链接"功能问题

2020/03/26 Javascript

Vue单文件组件开发实现过程详解

2020/07/30 Javascript

python清除字符串中间空格的实例讲解

2018/05/11 Python

基于Python绘制美观动态圆环图、饼图

2020/06/03 Python

完美解决keras 读取多个hdf5文件进行训练的问题

2020/07/01 Python

python中id函数运行方式

2020/07/03 Python

如何使用Django Admin管理后台导入CSV

2020/11/06 Python

python实现xml转json文件的示例代码

2020/12/30 Python

canvas实现烟花的示例代码

2020/01/16 HTML / CSS

《回乡偶书》教学反思

2014/04/12 职场文书

2014幼儿园教师师德师风演讲稿

2014/09/10 职场文书

2014年人力资源工作总结

2014/11/19 职场文书

2015年试用期工作总结

2014/12/12 职场文书

2014年终个人总结报告

2015/03/09 职场文书

小学班主任研修日志

2015/11/13 职场文书

关于办理居住证的介绍信模板

2019/11/27 职场文书

《别在吃苦的年纪选择安逸》读后感3篇

2019/11/30 职场文书

修改并编译golang源码的操作步骤

2021/07/25 Golang