[转载]淘宝Kissy框架分析【六】 - BlueDream - 博客园

[转载]淘宝Kissy框架分析【六】 – BlueDream – 博客园.

现在开始分析kissy-ua.js 浏览器检测部分.

源码如下:

复制代码
/**
* @module    j1616-ua
* @author    liangchaoyjs@163.com
*/
J1616.add(
j1616-uafunction(J) {
var ua = navigator.userAgent,
m,
= {
webkit: 
0,
chrome: 
0,
safari: 
0,
gecko: 
0,
firefox: 
0,
ie: 
0,
opera: 
0,
mobile: 

},
numberify 
= function(s) {
var c = 0;
return parseFloat(s.replace(/\./g, function() {
return (c++ === 0? . : ;
}));
};

// WebKit
    if ((m = ua.match(/AppleWebKit\/([\d.]*)/)) && m[1]) {
        o.webkit = numberify(m[1]);

// Chrome
        if ((m = ua.match(/Chrome\/([\d.]*)/)) && m[1]) {
            o.chrome = numberify(m[1]);
}

// Safari
        if ((m = ua.match(/\/([\d.]*) Safari/)) && m[1]) {
            o.safari = numberify(m[1]);
}

// Apple Mobile
        if (/ Mobile\//.test(ua)) {
            o.mobile = Apple// iPad, iPhone or iPod Touch
        }
// Other WebKit Mobile Browsers
        else if ((m = ua.match(/NokiaN[^\/]*|Android \d\.\d|webOS\/\d\.\d/))) {
o.mobile 
= m[0]; // Nokia N-series, Android, webOS, ex:NokiaN95
        }
}
// NOT WebKit
    else {
// Opera
        if ((m = ua.match(/Opera\/.* Version\/([\d.]*)/)) && m[1]) {
o.opera 
= numberify(m[1]);

// Opera Mini
            if ((ua.match(/Opera Mini[^;]*/))) {
o.mobile 
= m[0]; // ex: Opera Mini/2.0.4509/1316
            }
// NOT WebKit or Opera    
        } else {
// MSIE
            if ((m = ua.match(/MSIE\s([^;]*)/)) && m[1]) {
o.ie 
= numberify(m[1]);

// NOT WebKit, Opera or IE
            } else {
// Gecko
                if ((m = ua.match(/Gecko/))) {
o.gecko 
= 1;
if ((m = ua.match(/rv:([\d.]*)/)) && m[1]) {
o.gecko 
= numberify(m[1]);
}

// Firefox
                    if ((m = ua.match(/Firefox\/([\d.]*)/)) && m[1]) {
                        o.firefox = numberify(m[1]);
}
}
}
}
}
J.UA 
= o;
});

复制代码

这里不会源码做剖析,因为都是比较容易理解. 但现在对于UA浏览器嗅探和特性检测(如JQuery)的孰优孰劣.我认为都有其合适的应用场景.看自己的需求吧.如果需要特性检测可以参考JQuery源码.

 

用法:

复制代码
(function(J) {
document.write(J.UA.ie 
+ <br/>) ;
document.write(J.UA.firefox 
+ <br/>);
document.write(J.UA.chrome 
+ <br/>);
document.write(J.UA.opera 
+ <br/>);
document.write(J.UA.safari 
+ <br/>);

})(J1616);

复制代码

如果是目标浏览器那么会返回该浏览器的版本号.如果不是那么就返回0。

比如.你想检测浏览器是不是IE并且是IE8 就可以写 J.UA.ie && J.UA.ie === 8.

 

关于浏览器各大排版引擎的介绍可参考这篇文章.

至此.整个kissy文件夹的3个.js文件都分析完毕了. 接着改啃比较大块的dom文件夹了.fighting!

赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏