Similarities and differences between. Prop () and. attr () in jquery1.6

 .prop ()  1,. Prop (PropertyName) Gets the value 2,. Prop (PropertyName, value) that matches the property of the first element in the collection. Prop (map). Prop ( PropertyName, function (index, oldpropertyvalue) sets one or more properties  .prop () and. attr () differences to the set of matching elements   The following is a description of the attributes module changes in jQuery1.6 and 1.6.1, and the preferred use of the. attr () method and the. Prop () method   The change in the attributes module was to remove ambiguities between the attributes and properties, but it caused some confusion in the jquery community because one method was used in all versions prior to 1.6 (. attr ()) To deal with attributes and properties. But the old. attr () method has some bugs that are difficult to maintain. jQuery1.6.1 has updated the Attributes module and fixed several bugs.  elem.checked True (Boolean) would change with checkbox state$ (elem). Prop ("checked") True (Boolean) would change with C Heckbox stateelem.getattribute ("checked") "Checked" (String) Initial State of the checkbox; does not change$ (elem). attr ("Checked") (1.6) "Checked" (String) Initial State of the checkbox; does not change$ (elem). attr ("Checked") (1.6.1+) "Checked" (String) would change with checkbox state$ (elem). attr ("Checked" ) (pre-1.6) True (Boolean) Changed with checkbox state if (elem.checked) if ($ (elem). Prop ("CheckEd ")) if ($ (elem). Is (": Checked "))   All three of these are return Boolean values.    in order to make the changes of the. attr () method in jQuery1.6 understood clearly, here are some examples of using. attr (), although it works correctly in previous versions of jquery, but now you must use the. Prop () method instead:   

First, the use of the. attr () method in window or document does not work correctly in jQuery1.6 because the window and document cannot have attributes. They contain properties (for example, location or readystate) and must be manipulated using the. Prop () method or simply using JavaScript native methods. In jQuery1.6.1, window and document use. attr () will be automatically turned into use. Prop instead of throwing an error.

Second, checked,selected and the other Boolean attributes mentioned earlier are treated specially because of the special relationship between these attributes and their corresponding properties. Basically, a attribute is what you see in the following HTML:

<input type= "checkbox" checked= "Checked" >

A Boolean attributes, such as: checked, is only set to the default or initial value. In the element of a checkbox, checked attributes is set when the page loads, regardless of whether the checkbox element is selected.

the properties are what the browser uses to record the current value. under normal circumstances, the properties reflect their corresponding attributes (if present). But this is not the case with a Boolean attriubutes. the Boolean properties remain up-to-date when the user taps a checkbox element or selects an option for a SELECT element. But the corresponding Boolean attributes are not the same, as described above, they are only used by the browser to save the initial value .

$ (": CheckBox"). Get (0). checked = true;

is the same as $ (": Checkbox:first"). Prop ("checked", true);

In jQuery1.6, if you set checked using the following method:

$ (": CheckBox"). attr ("Checked", true);

The checkbox element will not be checked because it is a property that needs to be set, but all of your settings are initial values.

However, when jQuery1.6 was released, the jquery team understood that setting some values was not particularly useful when the browser was only concerned with page loading. So, to keep backwards compatibility and the usefulness of the. attr () method, we can continue to use the. attr () method in jQuery1.6.1 to get and set these Boolean attributes.

The most common attributes are checked,selected,disabled and ReadOnly, but the following is the use of jQuery1.6.1 support. attr () dynamically acquire and set the Boolean attributes/ A complete list of properties:

Autofocus, AutoPlay, async, checked, controls, defer, disabled,

Hidden, loop, multiple, open, ReadOnly, required, scoped, selected

It is also recommended that you use the. Prop () method to set these Boolean attributes/properties, even if these use cases are not converted to use the. Prop () method, but your code can still run correctly in jQuery1.6.1.

Here are a list of some of the attributes and properties, which should normally be used with their corresponding methods (see the list below) to get and set them. The following is the first usage, but the. attr () method can run in all attributes cases.

Note: The properties of some DOM elements are also listed below, but only run in the new. Prop () method

* For example: window.location

* * If required on (if needed over). Width ()

. attr () and. Prop () should not be used to value/set values. Use the. Val () method instead (even if you use. attr ("value", "somevalue") to continue running, as you did before 1.6)

3. Overview of Preferred usage

The. Prop () method should be used to handle Boolean attributes/properties and properties that do not exist in HTML (for example, window.location). All other attributes (those you see in HTML) can and should continue to be manipulated using the. attr () method.

The above overview has been described clearly enough, and I do not need to summarize it.

Reference: http://hxq0506.iteye.com/blog/1046334

Similarities and differences between. Prop () and. attr () in jquery1.6