前言
jQuery的属性support是判断浏览器之间是否兼容的模块 ，该模块包含了
leadingWhitespace，tbody，htmlSerialize，style，hrefNormalized，opacity，cssFloat，checkOn，optSelected，getSetAttribute….
等兼容问题，所有的这些属性也只是jQuery内部会用到，因为jQ内部一些模块需要对这些东西进行判断， 就直接写成了一个support模块， 可以供我们， 但是我们写代码的时基本都没用到啊，今天再把这些玩意儿过一下， 测试的浏览器为FF，CHROME，IE11， IE6-IE10是用IE11模拟的：
$.support.leadingWhitespace
———— IE中自动去空格$.support.checkOn
—-chrome中radio默认值为checkOn$.support.tbody
—-IE通过innerHTML自动生成tbody$.support.htmlSerialize
—– 标准浏览器会自动生成link标签$.support.style
—-IE67中getAttriute会获取各种类型的数据….$.support.opacity
—- IE678不支持opacity$.support.cssFloat
—-cssFloat标准浏览器支持的，IE要用styleFloat$.support.optSelected
—–浏览器并不会设置默认的option$.support.getSetAttribute
—-getSetAttribute在浏览器之间的兼容$.support.html5Clone
—- 复制标签的问题$.support.BoxModel
—- 是否支持盒模型$.support.submitBubbles
—-冒泡$.support.changeBubbles
—-冒泡$.support.focusinBubbles
—-冒泡$.support.deleteExpando
—–IE的DOM元素是COM组件， 不能delete组件的属性$.support.noCloneEvent
—-复制元素的事件$.support.reliableHiddenOffsets
—-table元素中tr内td的问题；$.support.BoxSizing
—是否支持BoxSizing$.support.doesNotIncludeMarginInBodyOffset
—-body不会包含margin的问题（算不算问题呢？）$.support.pixelPosition
—-获取样式返回的是否是像素值$.support.BoxSizingReliable
—-BoxSizing是否可用$.support.reliableMarginRight
—-chrome中margin的bug$.support.inlineBlockNeedsLayout
—-IE中layout的问题$.support.shrinkWrapBlocks
—-IE6中自动扩大宽高的问题$.support.leadingWhitespace属性
//但是我们可以通过jQuery的方式生成并插入到DOM数种
$("").appendTo(document.body)
$.support.style
标准浏览器通过getAttribute获取都应该是字符串的，IE67你getAttriute是各种奇葩，你获取的style是一整个样式对象,IE67要获取行内样式要用 eDiv.style.cssText 才行哦
在IE6中执行会变成这样：
， 而且这个特性在IE11模拟IE5，IE6一点效果都没有；
小技巧为了让IE6支持HTML5的标签可以自己创建html5标签，而且你可以给这些标签自定义样式：
<style>
nav{
width:100px;
height:100px;
background:#f00;
display:block;
}
</style>
<nav>nav</nav>
<footer>footer</footer>
<script type="text/javascript">
window.l = (function() {
var el = document.createElement("div"),index = 0;
el.style.cssText = "padding:10px;position:fixed;top:0;right:0;width:10%;border:1px solid #f00;";
return function(message) {
message = message.toString();
if( message ) {
var span = document.createElement("span");
span.innerHTML = (++index) + "信息:<br>"+ message+"<br>";
el.appendChild( span );
};
//IE低版本直接通过createElement创建的元素有parentNode;
if( !el.parentNode || (el.parentNode.toString() === "[object]") ) {
document.body.appendChild(el);
};
return l;
};
})();
</script>
<script type="text/javascript">
l(document.createElement("nav").cloneNode( true ).outerHTML);
</script>$.support.boxModel
这个玩意儿 document.compatMode === “‘BackCompat'” 是为了让我们知道当前的文档模式是否是标准的文档模式，还是有用的;
$.support.submitBubbles,$.support.changeBubbles,$.support.focusinBubbles
除了火狐以外所有的浏览器都支持focusin和focusout， 这两个事件和focus和blur的区别是， focus和blur并不会发生冒泡，focusin和focusout会冒泡， 我们可以通过focusin和focusout实现事件代理， 例子：
虽然就只有firefox不支持focusin， 但是support.focusinBubbles在ff，chrome，以及IE11中的值都为
false
， 也就是说jQuery把他们都统一起来，通过focus
和blur
的的自定义代理模拟focusin
和focusout
；因为ie6-ie10中都支持attachEvent方法，所以focusinBubble都为true， IE11不支持attachEvent，所以
focusinBubble
为false
了;submitBubbles
和changeBubbles
在IE8以下的浏览器中都是false;结果的确有点乱， 在后面的事件系统中不支持事件冒泡是要做特殊处理的，下面这个代码从jQ中切出来(￣_,￣ )的代码；
<script type="text/javascript">
var support = {
submitBubbles: true,changeBubbles: true,focusinBubbles: false
};
var div = document.createElement("div");
if ( div.attachEvent ) {
for ( i in {
submit: true,change: true,focusin: true
}) {
eventName = "on" + i;
isSupported = ( eventName in div );
if ( !isSupported ) {
div.setAttribute( eventName,"return;" );
isSupported = ( typeof div[ eventName ] === "function" );
};
support[ i + "Bubbles" ] = isSupported;
};
};
l( JSON.stringify(support) );
</script>