JQUERY1.6 使用方法四 检测浏览器

 更新时间:2011年11月23日 18:38:15   作者:  
JQUERY1.6 使用方法四 检测浏览器实现代码,需要的朋友可以参考下。
userAgent = navigator.userAgent,//User Agent中文名为用户代理,简称 UA,它是一个特殊字符串头,使得服务器能够识别客户使用的操作系统及版本、CPU 类型、浏览器及版本、浏览器渲染引擎、浏览器语言、浏览器插件等。

下面分别是各个浏览器的navigator.userAgent

//Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-CN) AppleWebKit/533.21.1 (KHTML, like Gecko) Version/5.0.5 Safari/533.21.1 --safari

//Mozilla/5.0 (Windows NT 5.1) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/13.0.782.220 Safari/535.1 --chrome

//Opera/9.80 (Windows NT 5.1; U; Edition Next; zh-cn) Presto/2.8.158 Version/11.50 --opera

//Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; InfoPath.1; .NET4.0C; .NET4.0E; InfoPath.2) ---ie

//Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-CN; rv:1.9.2.24) Gecko/20111103 Firefox/3.6.24 --firefox



//用于匹配响应浏览器表示的正则

rwebkit = /(webkit)[ \/]([\w.]+)/,//webkit
ropera = /(opera)(?:.*version)?[ \/]([\w.]+)/,//opera
rmsie = /(msie) ([\w.]+)/,//ie
rmozilla = /(mozilla)(?:.*? rv:([\w.]+))?/,//mozilla



通过userAgent,我们可以看到chrome可以通过以下方式匹配到,但是因为和safari一样,都带有“safari”,我们可以把它放在rwebkit.前进行匹配

rchrome=/(Chrome)[ \/]([\w.]+)/

同样firefox也可以这么做,把它放在rmozilla前面进行判断

rfirefox=/(Firefox)[ \/]([\w.]+)/



uaMatch: function( ua ) {//主要是获得的浏览器的类型和版本
ua = ua.toLowerCase();//参数为navigator.userAgent。转换成小写,当然也可以在正则匹配里声明不区分大小写(如 /(webkit)[ \/]([\w.]+)/i)

var match = rwebkit.exec( ua ) ||
ropera.exec( ua ) ||
rmsie.exec( ua ) ||
ua.indexOf("compatible") < 0 && rmozilla.exec( ua ) ||
[];//由于使用exec进行匹配,返回的结果是一个整体匹配和响应的子匹配,例如/(Chrome)[ \/]([\w.]+)/,match会返回Chrome/13.0.782.220,match[1]得到chrome,match[2]得到13.0.782.220;

return { browser: match[1] || "", version: match[2] || "0" };
}

//uaMatch是jQuery里的一个方法,在这边开始调用并保存浏览器型号browser和版本version

browserMatch = jQuery.uaMatch( userAgent );//调用uaMatch,并返回对象return { browser: match[1] || "", version: match[2] || "0" };
if ( browserMatch.browser ) {
jQuery.browser[ browserMatch.browser ] = true;//chrome\safari\opera\msie\mozilla ,比如我们要在opera浏览器下执行特定操作的时候,可以通过$.browser.opera来判断是不是opera浏览器(true,false)

jQuery.browser.version = browserMatch.version;//浏览器版本
}


if ( jQuery.browser.webkit ) {
jQuery.browser.safari = true;//因为safari是使用AppleWebKit引擎,由于和chrome都有safari,所以在做另外处理
}

相关文章

  • js/jquery判断浏览器类型的方法小结

    js/jquery判断浏览器类型的方法小结

    有些时候需要根据浏览器来写样式,所以要判断一下浏览器类型,百度了一下,才知道JQuery有个方法直接判断,并附上原生的js的判断方法,分享给大家,有需要的小伙伴可以参考下。
    2015-05-05
  • jQuery拖拽插件gridster使用指南

    jQuery拖拽插件gridster使用指南

    gridster.js是一款基于jquery的前端拖拽插件,效果相当的不错,大家可以先看看Demo(http://gridster.net/#intro)(蓝色部分的白块就是了,可以随便拖动,娱乐性很强)。
    2015-04-04
  • jquery带有索引按钮且自动轮播切换特效代码分享

    jquery带有索引按钮且自动轮播切换特效代码分享

    这篇文章主要介绍了jquery实现的带有索引按钮且自动轮播切换特效,图片简单大方,感兴趣的小伙伴可以参考下。
    2015-09-09
  • 基于jquery的获取mouse坐标插件的实现代码

    基于jquery的获取mouse坐标插件的实现代码

    用jquery实现的获取mouse坐标的实现代码,需要的朋友可以参考下。
    2010-04-04
  • jQuery中animate()方法用法实例

    jQuery中animate()方法用法实例

    这篇文章主要介绍了jQuery中animate()方法用法,以实例形式分析了animate()方法的功能、定义及具体使用技巧,具有一定的参考借鉴价值,需要的朋友可以参考下
    2014-12-12
  • JQuery节点元素属性操作方法

    JQuery节点元素属性操作方法

    这篇文章主要介绍了JQuery节点元素属性操作方法,实例分析了attr与removeAttr方法操作节点元素属性的相关使用技巧,需要的朋友可以参考下
    2015-06-06
  • jQuery插件Timelinr 实现时间轴特效

    jQuery插件Timelinr 实现时间轴特效

    时间轴是依据时间顺序,把一方面或多方面的事件串联起来,形成相对完整的记录体系,再运用图文的形式呈现给用户,本文给大家收集了互联网上的效果比较不错的一款,分享给大家
    2015-10-10
  • jQuery中replaceWith()方法用法实例

    jQuery中replaceWith()方法用法实例

    这篇文章主要介绍了jQuery中replaceWith()方法用法,以实例形式分析了replaceWith()方法用于匹配元素替换的技巧,具有一定的参考借鉴价值,需要的朋友可以参考下
    2014-12-12
  • jQuery实现可以扩展的日历

    jQuery实现可以扩展的日历

    这篇文章主要为大家详细介绍了jQuery实现可以扩展的日历,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • 通过jquery还原含有rowspan、colspan的table的实现方法

    通过jquery还原含有rowspan、colspan的table的实现方法

    通过jquery还原含有rowspan、colspan的table的实现方法,学习jquery的朋友可以参考下
    2012-02-02

最新评论