Source code interpretation JQ Browser-compatible module support 1th/2 page _jquery

Source: Internet
Author: User
Tags html tags

Objective

jquery's attribute support is a module that determines whether browsers are compatible, including the leadingwhitespace,tbody,htmlserialize,style,hrefnormalized,opacity, Cssfloat,checkon,optselected,getsetattribute -compatible issues, all of these attributes are only used within jquery, because some modules within the JQ need to judge these things. It's written directly into a support module that can be used for us, but it's basically useless when we write code.

Today again, the test browser for FF,CHROME,IE11, Ie6-ie10 is simulated with IE11:

$.support.leadingwhitespace ———— ie automatically to space

Radio default value in $.support.checkon --chrome is Checkon

$.support.tbody --ie automatically generated by innerHTML Tbody

$.support.htmlserialize -– Standard browser automatically generates link labels

$.support.style --ie67 Getattriute gets various types of data ....

$.support.opacity --IE678 does not support opacity

$.support.cssfloat --cssfloat Standard browser support, ie to use stylefloat

$.support.optselected -– Browser does not set default option

$.support.getsetattribute --getsetattribute compatibility between browsers

$.support.html5clone --the issue of duplicating labels

$.support.boxmodel --whether the box model is supported

$.support.submitbubbles --bubbling

$.support.changebubbles --bubbling

$.support.focusinbubbles --bubbling

$.support.deleteexpando -–ie DOM element is a COM component and cannot delete a component's properties

$.support.nocloneevent --Events that replicate elements

$.support.reliablehiddenoffsets --table elements in TR internal TD problem;

$.support.boxsizing -Do you support boxsizing

$.support.doesnotincludemargininbodyoffset --body does not contain the margin problem. )

$.support.pixelposition --Gets whether the style returns a pixel value

$.support.boxsizingreliable --boxsizing is available

Margin bugs in $.support.reliablemarginright --chrome

The problem of layout in $.support.inlineblockneedslayout --ie

The problem of automatically enlarging the height in the $.support.shrinkwrapblocks --ie6

$.support.leadingwhitespace Property

 

Standard browser is in compliance with user input, El should contain three nodes : ["", "<div id=\" null\ "> </div>", ""] node;

There are only 1 nodes in the IE678, and this node is the div:

$.support.checkon Property

CheckBox default value in standard browser is "on",IE5678 is also "on", but in some webkit the value of checkbox defaults to "" String, now the browser version is very high, basically do not have this problem, If you have a low chrome version, you can use the demo test below to see if there are any problems:

 

$.support.tbody Property

Creating a new table in IE6 and IE7 automatically creates the TBODY element;

If we add TR or add TD to the table we created, then all browsers will automatically create tbody;

If it is dynamically created table and TR, add TR to tbody, then Tbod won't come out at all, and all browsers will follow the developer's action (the browser's mind is really hard to guess)

 

After the code is finished you will see that when there is no element in the table, Chrome does not automatically generate TBODY, if you do not write the table in the normal way, but this

"<table><tr>111</tr></table>";

The resulting HTML turns out to be like this " 111<table><tr></tr></table>“,  in JQ you write HTML like this $(“<table><tr>111</tr></table>”), , ["111","<table><tr></tr></table>"], so you repeatedly emphasize that the nesting of HTML tags should conform to the standard ....

In IE is an exception, the way through innerHTML will automatically add Tbody, and you label nested wrong He also regardless of you, through the appendchild way with other browsers will not be the initiative to generate tbody;

$.support.htmlserialize

IE678 browsers do not dynamically generate link labels through innerHTML, which are created by creating a new label:

 

Although most of the link tags can be generated by innerHTML, it is not feasible to generate script tags through innerHTML:

Current 1/2 page 12 Next read the full text

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.