javasc!ript框架设计之浏览器的嗅探和特征侦测

　　浏览器的嗅探现在已经不推荐了，但在某些场合还是需要的。比如一些统计脚本。在标准浏览器里，提供了document.implementation.hasfeature,可惜有bug,不准确，目前，w3c又推出了CSS.supports方法，显示出大家对这块的关注。

　　1.判定浏览器。

　　主流的浏览器有ie firefox opera chorme safari 早期这些框架都是通过navigator.userAgent进行判定，目前国外的浏览器几乎都是可以判定的。

　　关于浏览器的判断脚本，jQuery已经移出本体，形成一个插件。更多的方式不多介绍，

　　移动设备的相关判定，这个建议看jQuery mobile与zepto的源代码。

　　代码如下:

　　isIPone = /isIPone/i.test(navigator.userAgent);

　　isIPone4 = window.devicePixelRatio >= 2 //在网页中，pixel与point比值称为device-pixel-ratio,普通设备都是1，iPhone4是2，有些 安卓机型是1.5

　　isIpad = /ipad/i.test(navigator.userAgent)

　　isAndroid = /android/i.test(navigator.userAgent)

　　isIOS = isIPone || isIpad

　　国内的浏览器判定可以看Tangrame或qwrap,它们基本是IE,webkit,blink内核。

　　2.事件的支持侦测

　　prototype的核心成员kangax写了一篇文章，来判断浏览器对某种事件的支持。里面给出的实现如下：

　　现在jQuery等框架都是使用脚本的简化版

　　不过哪一个也好，这种检测只对DOM0奏效，像DOMMouseScroll DOMContentLoaded DOMFocusIn DOMFocusOut DOMSubtreeModified DOMNodeInserted DOMNodeRemoved DOMNodeRemovedFromDocument DOMNodeInsertedIntoDocument DOMAttrModified DOMCharactorDataModified这些以DOM开头的就无能为力了。

　　这些事件中，有的非常有用，如DOMMouseScroll，firefox一直不支持mousesheel，只能用它做替代品。

　　DOMContentLoaded是实现domReady的重要事件;DOMNodeRemoved是判定元素是否从其父节点移除，父节点可能是其它元素节点或文档碎片;DOMNodeRemovedFromDocument 是移离DOM树，DOMAttrModified 以前经常用于模拟IE的onpropertyChange

　　css3添加两种动画，一种是transition动画，另外一种是keyframe补间动画。它们在事件结束时都用事件回调。但在标准化过程中，浏览器给它们起的名字相当于没规则。这个也需要预先侦测出来。