首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 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判断当前浏览器的实现代码

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

- Author -

mdxy-dxy

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

Javascript 相关文章推荐
用jQuery打造TabPanel效果代码
May 22 Javascript
JavaScript禁止页面操作的示例代码
Dec 17 Javascript
常用的JavaScript模板引擎介绍
Feb 28 Javascript
Javascript中For In语句用法实例
May 14 Javascript
深入理解React中es6创建组件this的方法
Aug 29 Javascript
基于javascript实现的购物商城商品倒计时实例
Dec 11 Javascript
Bootstrap缩略图与警告框学习使用
Feb 08 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
Feb 10 Javascript
微信小程序获取音频时长与实时获取播放进度问题
Aug 28 Javascript
vue实现自定义H5视频播放器的方法步骤
Jul 01 Javascript
微信小程序实现页面分享onShareAppMessage
Aug 12 Javascript
JS组件库AlloyTouch实现图片轮播过程解析
May 29 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
条形码(1) OOP(1) SeaTable(1) Three.js(1) Mysql8(2) kubernetes(1) tree shaking(1) MutationObserver(1) HBuilder(1) celery(1)
You might like
PHPlet在Windows下的安装
2006/10/09 PHP
php实现分页显示
2015/11/03 PHP
Zend Framework动作控制器用法示例
2016/12/09 PHP
php实现小程序支付完整版
2018/10/09 PHP
繁简字转换功能
2006/07/19 Javascript
node.js中的url.resolve方法使用说明
2014/12/10 Javascript
JavaScript实现N皇后问题算法谜题解答
2014/12/29 Javascript
使用BootStrap实现用户登录界面UI
2016/08/10 Javascript
纯JS焦点图特效实例(可一个页面多用)
2016/12/07 Javascript
详解基于Angular4+ server render(服务端渲染)开发教程
2017/08/28 Javascript
vuejs实现本地数据的筛选分页功能思路详解
2017/11/15 Javascript
关于Vue在ie10下空白页的debug小结
2018/05/02 Javascript
Angular使用ControlValueAccessor创建自定义表单控件
2019/03/08 Javascript
vue中的inject学习教程
2019/04/24 Javascript
vue 解决兄弟组件、跨组件深层次的通信操作
2020/07/27 Javascript
Python多线程编程（三）：threading.Thread类的重要函数和方法
2015/04/05 Python
对Python中列表和数组的赋值,浅拷贝和深拷贝的实例讲解
2018/06/28 Python
Python爬虫将爬取的图片写入world文档的方法
2018/11/07 Python
老生常谈python中的重载
2018/11/11 Python
Django stark组件使用及原理详解
2019/08/22 Python
Python shelve模块实现解析
2019/08/28 Python
tensorflow实现二维平面模拟三维数据教程
2020/02/11 Python
学生如何注册Pycharm专业版以及pycharm的安装
2020/09/24 Python
联想法国官方网站：Lenovo法国
2018/10/18 全球购物
Goodee官方商店：迷你投影仪
2021/03/15 全球购物
游戏商店：Eneba
2020/04/25 全球购物
环境工程与管理大学毕业生求职信
2013/10/02 职场文书
大学毕业登记表自我鉴定
2013/10/09 职场文书
职工运动会感言
2014/02/07 职场文书
勤俭节约倡议书
2014/04/14 职场文书
2014年最新党员对照检查材料汇总
2014/09/15 职场文书
2015年家长学校工作总结
2015/04/22 职场文书
农民工工资承诺书大全
2015/05/04 职场文书
活着观后感
2015/06/03 职场文书
提取视频中的音频 Python只需要三行代码!
2021/05/10 Python
HTML5中的DOCUMENT.VISIBILITYSTATE属性详解
2023/05/07 HTML / CSS