jQuery.support 用于检查浏览器对各项特性的支持。检查项多达 27 个。
首先,让我们用一段代码测试一下 support 中包含的检查项:
<script src='jquery.js'></script>
<script>
support = $.support;
for (key in support) {
document.write('support.' + key + ' = ' + support[key] + '<br />');
}
</script>
IE 下的输出结果为:
support.leadingWhitespace = false
support.tbody = false
support.htmlSerialize = false
support.style = false
support.hrefNormalized = false
support.opacity = false
support.cssFloat = false
support.checkOn = true
support.optSelected = false
support.getSetAttribute = false
support.submitBubbles = false
support.changeBubbles = false
support.focusinBubbles = true
support.deleteExpando = false
support.noCloneEvent = false
support.inlineBlockNeedsLayout = false
support.shrinkWrapBlocks = true
support.reliableMarginRight = true
support.noCloneChecked = false
support.optDisabled = true
support.radioValue = false
support.checkClone = undefined
support.appendChecked = false欠款
support.boxModel = false
support.reliableHiddenOffsets = false
support.ajax = true
support.cors = false
FireFox 中的显示结果为:
support.leadingWhitespace = true
support.tbody = true
support.htmlSerialize = true
support.style = true
support.hrefNormalized = true
support.opacity = true
support.cssFloat = true
support.checkOn = true
support.optSelected = true
support.getSetAttribute = true
support.submitBubbles = true
support.changeBubbles = true
support.focusinBubbles = false
support.deleteExpando = true
support.noCloneEvent = true
support.inlineBlockNeedsLayout = false
support.shrinkWrapBlocks = false
support.reliableMarginRight = true
support.noCloneChecked = true
support.optDisabled = true
support.radioValue = true
support.checkClone = undefined
support.appendChecked = true
support.boxModel = true
support.reliableHiddenOffsets = true
support.ajax = true
support.cors = true
要注意的是,源代码中 checkClone 的检查是有问题的。这将在后面提到。
接下来,我们就对这些检查项进行逐一的分析。
leadingWhitespace
检查用 innerHTML 赋值时,是否会保留前面的空白符。
IE中为 false , Firefox 中为 true 。
实现方式如下:
$ = function(){ 女装品牌大全
var div = document.createElement( "div" );
div.innerHTML = " <link/><table></table><a href='/a' style='top:1px;float:left;opacity:.55;'>a</a><input type='checkbox'/>";
var support = {
leadingWhitespace: (div.firstChild.nodeType === 3)
}
return { support : support }
}();
这段代码中,先创建了一个 div ,之后就用 innerHTML 为 div 赋值,
然后检查 div 的第一个子元素的 nodeType 是否为 3 (表示文本),
是的话则空白字符被保留,否则未被保留。