首页
所有分类
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 相关文章推荐
js中字符替换函数String.replace()使用技巧
Aug 14 Javascript
JavaScript之IE的fireEvent方法详细解析
Nov 20 Javascript
javascript Event对象详解及使用示例
Nov 22 Javascript
深入浅出理解javaScript原型链
May 09 Javascript
谈谈JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)
Oct 01 Javascript
window.location.reload 刷新使用分析(去对话框)
Nov 11 Javascript
Node.js与MySQL交互操作及其注意事项
Oct 05 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
Feb 14 Javascript
TypeScript入门-基本数据类型
Mar 28 Javascript
underscore之Collections_动力节点Java学院整理
Jul 10 Javascript
Angular实现的简单查询天气预报功能示例
Dec 27 Javascript
React Component存在的几种形式详解
Nov 06 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
scrapy(1) HttpClient(1) DeOldify(1) 注解(1) BottomSheetDialog(1) 反射(1) dataBinding(1) RestTemplate(1) Quartz(1) ip2region(1)
You might like
php报表之jpgraph柱状图实例代码
2011/08/22 PHP
yii实现创建验证码实例解析
2014/07/31 PHP
Zend Framework动作助手Url用法详解
2016/03/05 PHP
php微信公众平台配置接口开发程序
2016/09/22 PHP
php记录搜索引擎爬行记录的实现代码
2018/03/02 PHP
Tinymce+jQuery.Validation使用产生的BUG
2010/03/29 Javascript
xml文档转换工具，附图表例子(hta)
2010/11/17 Javascript
javascript写的简单的计算器，内容很多，方法实用，推荐
2011/12/29 Javascript
深入理解JavaScript系列（14） 作用域链介绍(Scope Chain)
2012/04/12 Javascript
JavaScript获取客户端计算机硬件及系统等信息的方法
2014/01/02 Javascript
javascript中的原型链深入理解
2014/02/24 Javascript
javascript实现一个简单的弹出窗
2016/02/22 Javascript
微信小程序 跳转方式总结
2017/04/20 Javascript
解决Vue中mounted钩子函数获取节点高度出错问题
2018/05/18 Javascript
Nodejs中的JWT和Session的使用
2018/08/21 NodeJs
Vue-router的使用和出现空白页,路由对象属性详解
2018/09/03 Javascript
vue实现类似淘宝商品评价页面星级评价及上传多张图片功能
2018/10/29 Javascript
vue子传父关于.sync与$emit的实现
2019/11/05 Javascript
对vuex中getters计算过滤操作详解
2019/11/06 Javascript
详解vue beforeEach 死循环问题解决方法
2020/02/25 Javascript
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
2020/11/09 jQuery
[00:36]DOTA2上海特级锦标赛 Alliance战队宣传片
2016/03/04 DOTA
Django接受前端数据的几种方法总结
2016/11/04 Python
详解python3中tkinter知识点
2018/06/21 Python
Python3爬虫之urllib携带cookie爬取网页的方法
2018/12/28 Python
基于python的docx模块处理word和WPS的docx格式文件方式
2020/02/13 Python
利用Python优雅的登录校园网
2020/10/21 Python
python实现KNN近邻算法
2020/12/30 Python
美国在线艺术商店：HandmadePiece
2020/11/06 全球购物
PHP面试题及答案二
2015/05/23 面试题
大学生简历的个人自我评价
2013/12/04 职场文书
春节晚会主持词
2014/03/24 职场文书
MySql存储过程之逻辑判断和条件控制
2021/05/26 MySQL
Python还能这么玩之用Python做个小游戏的外挂
2021/06/04 Python
CSS变量实现主题切换的方法
2021/06/23 HTML / CSS
Java十分钟精通进阶适配器模式
2022/04/06 Java/Android