Feature Testing(功能测试)
在使供应商特定的CSS属性标准化前,首先要确定浏览器是否支持标准的属性 或 带浏览器供应商前缀的变种。例如,检查支持border-radius 属性,还要检查该属性的任何变种写法是否是临时元素的 style 对象中的成员。
(function($) {
function styleSupport( prop ) {
var vendorProp, supportedProp,
// capitalize first character of the prop to test vendor prefix
capProp = prop.charAt(0).toUpperCase() + prop.slice(1),
prefixes = [ "Moz", "Webkit", "O", "ms" ],
div = document.createElement( "div" );
if ( prop in div.style ) {
// browser supports standard CSS property name
supportedProp = prop;
} else {
// otherwise test support for vendor-prefixed property names
for ( var i = 0; i < prefixes.length; i++ ) {
vendorProp = prefixes[i] + capProp;
if ( vendorProp in div.style ) {
supportedProp = vendorProp;
break;
}
}
}
// avoid memory leak in IE
div = null;
// add property to $.support so it can be accessed elsewhere
$.support[ prop ] = supportedProp;
return supportedProp;
}
// call the function, e.g. testing for "border-radius" support:
styleSupport( "borderRadius" );
})(jQuery);
|