2.8.12 浏览器嗅探：jQuery.uaMatch( ua )、jQuery.browser_H5之家

> Javascript > jQuery技术内幕：深入解析jQuery架构设计与实现原理 2.8.12　浏览器嗅探：jQuery.uaMatch( ua )、jQuery.browser 2014-01-21 14:59:27 我要投稿

本文所属图书 > jQuery技术内幕：深入解析jQuery架构设计与实现原理

本书由阿里巴巴资深前端开发工程师撰写，从源代码角度全面而系统地解读了jQuery的17个模块的架构设计理念和内部实现原理，旨在帮助读者参透jQuery中的实现技巧和技术精髓，同时本书也对广大开发者如何通过阅读源立即去当当网订购

属性jQuery.browser提供了访问当前页面的浏览器的信息，其中包含最流行的4种浏览器类型（IE、Mozilla、Webkit、Opera）和版本信息，属性值的结构如下：
// jQuery.browser
{
webkit/opera/msie/mozilla: true,
version: '版本号'
}

Chrome和Safari使用Webkit作为内核引擎，因此如果jQuery.browser.webkit为true则表示浏览器是Chrome或Safari；如果jQuery.browser.mozilla为true，则表示浏览器是Mozilla Firefox。

jQuery.browser通过解析navigator.userAgent来获取浏览器类型和版本号，这种技术也称为浏览器嗅探技术，用于解决浏览器不兼容问题；navigator是全局对象window的属性，指向一个Navigator对象，包含了正在使用的浏览器的信息；navigator.userAgent包含了浏览器用于HTTP请求的用户代理头（User-Agent）的值。

应该避免编写基于特定浏览器类型或版本号的代码，因为这会导致代码与特定的浏览器类型或版本紧密绑定在一起，另外，用户或浏览器也可以修改navigator.userAgent，欺骗脚本和服务器端；解决浏览器不兼容问题的更好做法是基于浏览器功能测试编写代码，具体请参阅第7章。

对navigator.userAgent的解析由方法jQuery.uaMatch( ua )实现，相关代码如下所示：
59     // Useragent RegExp
60     rwebkit = /(webkit)[ \/]([\w.]+)/,
61     ropera = /(opera)(?:.*version)?[ \/]([\w.]+)/,
62     rmsie = /(msie) ([\w.]+)/,
63     rmozilla = /(mozilla)(?:.*? rv:([\w.]+))?/,

74 // Keep a UserAgent string for use with jQuery.browser
75 userAgent = navigator.userAgent,

856     // Use of jQuery.browser is frowned upon.
857     // More details: docs.jquery.com/Utilities/jQuery.browser
858     uaMatch: function( ua ) {
859         ua = ua.toLowerCase();
860
861         var match = rwebkit.exec( ua ) ||
862             ropera.exec( ua ) ||
863             rmsie.exec( ua ) ||
864             ua.indexOf("compatible") < 0 && rmozilla.exec( ua ) ||
865             [];
866
867         return { browser: match[1] || "", version: match[2] || "0" };
868     },

891 browser: {}
892　});

899　browserMatch = jQuery.uaMatch( userAgent );
900　if ( browserMatch.browser ) {
901     jQuery.browser[ browserMatch.browser ] = true;
902     jQuery.browser.version = browserMatch.version;
903　}
904
905　// Dprecated, use jQuery.browser.webkit instead
906　if ( jQuery.browser.webkit ) {
907     jQuery.browser.safari = true;
908　}

第60～63行：定义用于解析用户代理navigator.userAgent的4个正则表达式：rwebkit、ropera、rmsie、rmozilla。每个正则包含两个分组：浏览器类型特征字符和浏览器版本特征字符。

第858～868行：定义方法jQuery.uaMatch( ua )，用于解析当前浏览器的类型和版本号。在方法jQuery.uaMatch( ua )中，依次尝试用4个正则表达式匹配用户代理navigator.userAgent，并返回一个包含了匹配结果的对象，对象的结构是：
{
browser: 分组 1 或空字符串,
version: 分组 2 或字符串"0"
}

第899～903行：调用方法jQuery.uaMatch( ua )解析用户代理navigator.userAgent，并把解析结果重新封装为jQuery.browser。

点击复制链接与好友分享!回本站首页您对本文章有什么意见或着疑问吗？请到论坛讨论您的关注和建议是我们前行的参考和动力上一篇：2.8.11　jQuery.error( message )、jQuery.noop()、jQuery.now() 下一篇：2.8.13　小结相关文章

1.2 Node.js 能做什么

1.4.2 Node.js 与PHP + Nginx

1.5.2 Java 与Javascript

1.6.2 CommonJS 规范与实现

1.1.2　算术

1.2 变量

1.3.2　prompt和confirm

1.4.2　while循环与do循环

1.5.2　自动类型转换

2.1　剖析函数定义

图文推荐

排行热门