其中为1.1~1.15 15个DOM兼容性测试
jQuery.support = (function() {
var support,
all,
a,
select,
opt,
input,
marginDiv,
fragment,
tds,
events,
eventName,
i,
isSupported,
div = document.createElement( "div" ),
documentElement = document.documentElement;
// Preliminary tests
div.setAttribute("className", "t");
div.innerHTML = " <link/><table></table><a href='/a' style='top:1px;float:left;opacity:.55;'>a</a><input type='checkbox'/>";
all = div.getElementsByTagName( "*" );
a = div.getElementsByTagName( "a" )[ 0 ];
// Can't get basic test support
if ( !all || !all.length || !a ) {
return {};
}
// First batch of supports tests
select = document.createElement( "select" );
opt = select.appendChild( document.createElement("option") );
input = div.getElementsByTagName( "input" )[ 0 ];
support = {
// IE strips leading whitespace when .innerHTML is used
// 1.1. 检测第一个子元素是否是文本节点
leadingWhitespace: ( firstChild.div.nodeType === 3 ),
// Make sure that tbody elements aren't automatically inserted
// IE will insert them into empty tables
// 1.2 按照HTML规范,子元素tbody是可选的,因此在大部分浏览器中,测试项tbody为true, 而在IE6, IE7中,浏览器会自动为空table元素插入空tbody元素。如果浏览器自动插入tbody元素,则个数为1,测试项tbody为false;如果不自动插入,则个数为0,测试项tbody为true
tbody: !div.getElementsByTagName("tbody").length,
// Make sure that link elements get serialized correctly by innerHTML
// This requires a wrapper element in IE
// 1.3 如果浏览器能正确的序列化link标签,则个数为1,测试项htmlSerialize为true, 否则为false
htmlSerialize: !!div.getElementsByTagName("link").length,
// Get the style information from getAttribute
// (IE uses .cssText instead)
style: /top/.test( a.getAttribute("style") ),
// Make sure that URLs aren't manipulated
// (IE normalizes it by default)
// 1.4 如果通过原生方法getAttribute("href")的返回值与设置的相对路劲是否相等,来测试测试项hrefNormalized为true
hrefNormalized: ( a.getAttribute("href") === "/a" ),
// Make sure that element opacity exists
// (IE uses filter instead)
// Use a regex to work around a WebKit issue. See #5145
opacity: /^0.55/.test( a.style.opacity ),
// Verify style float existence
// (IE uses styleFloat instead of cssFloat)
cssFloat: !!a.style.cssFloat,
// Make sure that if no value is specified for a checkbox
// that it defaults to "on".
// (WebKit defaults to "" instead)
// 1.5 如果复选框的属性value的默认值是"on",则测试项checkOn为true
// 在safari中,复选框的属性value的默认值是空字符串,此时测试项checkOn为false; 在其他浏览器中,默认值是字符串"on",此时测试项checkOn为true
checkOn: ( input.value === "on" ),
// Make sure that a selected-by-default option has a working selected property.
// (WebKit defaults to false instead of true, IE too, if it's in an optgroup)
// 在IE和早期的Safari中,默认选中的option元素的属性seleted为false, 测试项optSelected为false,
optSelected: opt.selected,
// Test setAttribute on camelCase class. If it works, we need attrFixes when doing get/setAttribute (ie6/7)
// 1.9 如果原生方法getAttribute()、setAttribute()、removeAttribute()可以正确地设置、读取和移除HTML属性。则测试项getSetAttribute为true
// 在IE6, IE7中,执行方法getAttribute()、setAttribute()、removeAttribute()时需要传入DOM属性作为参数而不是HTML属性,此时测试项getSetAttribute为false
getSetAttribute: div.className !== "t",
// Tests for enctype support on a form(#6743)
// 1.11 如果表单元素支持属性enctype, 则测试项enctype为true
// 属性enctype用于规定在将表单数据发送到服务器之前应该如何对其进行编码,它与属性encoding是等价的,但是在一些老版本里的浏览器中只支持属性encoding
// 这里通过两个逻辑非运算符(!)把属性enctpe的值转换为布尔值。
enctype: !!document.createElement("form").enctype,
// Makes sure cloning an html5 element does not cause problems
// Where outerHTML is undefined, this still works
// 1.12 如果浏览器能够正确地复制HTML5元素,则测试项HTML5Clone为true
// 在IE6, IE7, IE8中,无法正确地复制HTML5元素,测试项html5Clone为false, 在IE9+和其他浏览器中则为true
html5Clone: document.createElement("nav").cloneNode( true ).outerHTML !== "<:nav></:nav>",
// Will be defined later
submitBubbles: true,
changeBubbles: true,
focusinBubbles: false,
deleteExpando: true,
noCloneEvent: true,
inlineBlockNeedsLayout: false,
shrinkWrapBlocks: false,
reliableMarginRight: true
};
// Make sure checked status is properly cloned
input.checked = true;
// 1.6 在IE 中,复制DOM元素时不会复制属性checked, 测试项noCloneChecked为false,在其他浏览器中,会复制属性checked, 测试项noCloneChecked为true
support.noCloneChecked = input.cloneNode( true ).checked;
// Make sure that the options inside disabled selects aren't marked as disabled
// (WebKit marks them as disabled)
select.disabled = true;
// 1.8 在早期的Safari中,如果元素select被禁用,则子元素option会被自动禁用,此时测试项optDisabled为false; 在其他浏览器中,则不会自被自动禁用,测试项optDisabled则为true
support.optDisabled = !opt.disabled;
// Test to see if it's possible to delete an expando from an element
// Fails in Internet Explorer
// 1.10 如果浏览器允许删除DOM元素的属性,则测试项delteEXpando为true
// 在IE6, IE7, IE8中,删除DOM元素上的属性会抛出异常,此时测试项deleteExpando为false
// 尝试在div元素上执行delete div.test, 如果抛出异常,则测试项deleteExpando为false
try {
delete div.test;
} catch( e ) {
support.deleteExpando = false;
}
if ( !div.addEventListener && div.attachEvent && div.fireEvent ) {
div.attachEvent( "onclick", function() {
// Cloning a node shouldn't copy over any
// bound event handlers (IE does this)
support.noCloneEvent = false;
});
div.cloneNode( true ).fireEvent( "onclick" );
}
// Check if a radio maintains its value
// after being appended to the DOM
// 1.13 如果设置input元素的属性type为"radio"不会导致属性value的值丢失,则测试项radioValue为true
// 在IE中,设置input元素的属性type为"radio"会导致属性value的值丢失,测试项radioValue为false, 在其他浏览器中则为true
input = document.createElement("input");
input.value = "t";
input.setAttribute("type", "radio");
support.radioValue = input.value === "t";
// 如果浏览器再文档片段中能正确复制单选按钮和复选框的选中状态(即属性checked),则测试项checkClone为true
// 在IE6, IE7中,复制文档片段会丢失其中单选按钮和复选框的属性checked,此时测试项checkClone为false, 在IE8+和其他浏览器中则为true
input.setAttribute("checked", "checked");
div.appendChild( input );
fragment = document.createDocumentFragment();
fragment.appendChild( div.lastChild );
// WebKit doesn't clone checked state correctly in fragments
support.checkClone = fragment.cloneNode( true ).cloneNode( true ).lastChild.checked;
// Check if a disconnected checkbox will retain its checked
// value of true after appended to the DOM (IE6/7)
// 1.15已选中的单选按钮和复选按框添加到DOM树中后,如果仍然为选中状态,则测试项appendChecked为true
// 在IE6, IE7中,把已选中的单选按钮和复选框添加到DOM树中后会丢失选中状态,测试项appendChecked为false
support.appendChecked = input.checked;
fragment.removeChild( input );
fragment.appendChild( div );
div.innerHTML = "";
// Check if div with explicit width and no margin-right incorrectly
// gets computed margin-right based on width of container. For more
// info see bug #3333
// Fails in WebKit before Feb 2011 nightlies
// WebKit Bug 13343 - getComputedStyle returns wrong value for margin-right
if ( window.getComputedStyle ) {
marginDiv = document.createElement( "div" );
marginDiv.style.width = "0";
marginDiv.style.marginRight = "0";
div.style.width = "2px";
div.appendChild( marginDiv );
support.reliableMarginRight =
( parseInt( ( window.getComputedStyle( marginDiv, null ) || { marginRight: 0 } ).marginRight, 10 ) || 0 ) === 0;
}
// Technique from Juriy Zaytsev
// http://perfectionkills.com/detecting-event-support-without-browser-sniffing/
// We only care about the case where non-standard event systems
// are used, namely in IE. Short-circuiting here helps us to
// avoid an eval call (in setAttribute) which can cause CSP
// to go haywire. See: https://developer.mozilla.org/en/Security/CSP
if ( div.attachEvent ) {
for( i in {
submit: 1,
change: 1,
focusin: 1
}) {
eventName = "on" + i;
isSupported = ( eventName in div );
if ( !isSupported ) {
div.setAttribute( eventName, "return;" );
isSupported = ( typeof div[ eventName ] === "function" );
}
support[ i + "Bubbles" ] = isSupported;
}
}
fragment.removeChild( div );
// Null elements to avoid leaks in IE
fragment = select = opt = marginDiv = div = input = null;
return support;
})();