In a couple of days JQuery team will release a new version of jquery (1.6.1), after the community struggled the problems of the backward compatibility in the last release (1.6) .. the new release redefine the usage and the effect of it on the DOM objects of both .attr() and .prop() ,
in this version the boolean attribute manipulation with .attr() will back as it was before the 1.6 release.
lets see an example:
<input id="mychkbox" type="checkbox" checked>
the result of the previous markup is a checked checkbox as we all know =d,
but thats the property value not the attribute value cuz the attribute “checked” is not set.
lets see the .attr() results in v.1.6:
alert($("#mychkbox").attr("checked")) // result >> "" alert($("#mychkbox").prop("checked")) // true alert(document.getElementById("mychkbox").checked") // true
thats because the attribute doesn’t change when the user change its state by clicking on it., thats fine.. but look at the following code
in the coming 1.6.1 release & prior versions than 1.6:
alert($("#mychkbox").attr("checked")) // true alert($("#mychkbox").prop("checked")) // true (in 1.6.1 only) alert(document.getElementById("mychkbox").checked") // true
in the coming release the behavior of .attr() will back as it was before 1.6 just because the sake of backward compatibility.
so it will work exactly as expected but that doesn’t mean you have to keep using attr() , switch to .prop() cuz it is more faster and oriented.
it might be confusing now what we should use for what when it comes to .prop() and .attr(), so here is the best usage as the Jquery team stated:
.prop() method should be used for boolean attributes/properties and for properties which do not exist in html (such as window.location).
All other attributes (ones you can see in the html) can and should continue to be manipulated with the
.attr() method. ”
it is expected to see Jquery 1.6.1 at the end of this week, Also you can fill up the following proposal for new features to be landed in jquery 1.7.
Today, and as you see from the blog post title 😀 , JQuery 1.6 has been released !
But this time not like 1.5 release, there is no much new features as 1.5 had (deferred obj., jqXHR.. etc)..
so what we have here with 1.6 ??
case-mapping of data- attributes:
Its just a change in the way data- attributes object properties creation, in earler versions data-max-value will create an object with a property like max-value but now with 1.6 , the object would be maxValue.. So what about backward compatibility ?!” , people must start fixing there already written code. !
new methods: .prop(), .removeProp():
Jquery added 2 new methods to its default JQuery object, those methods will work with DOM attributes, I know whats on your mind now –.attr() huh!- yeah, the .attr() used to be the only method that works with elements attributes/properties (beside .val() & other task-specific methods) , It might be confusing so lets define both first:
attribute: is the initial value shipped with the DOM element ex. <input type=text value=”initialValue”>
property: it is the dynamic value, ie. any value added by user or changed programmatically.
that means having the same code will run differently when updating to the new version. backward compatibility ?!
Here is a simple example I have made for more explanation:
=#1= open this fiddle [uses Jquery 1.5.2]
write something in the textbox, and click the “click here to test” button
you will notice that the result is same as you wrote.
in the other side:
=#2= open this fiddle [uses Jquery 1.6]
write something in the textbox, and click the “click here to test .attr()” button
you will notice that the result is the initial value of the textbox.
BUT .. If you clicked the other button which uses the new .prop() method will get you the current value of the textbox.
Finally.. this new version of jquery doesn’t have any other major new features,all other changes are bugfixes, Performance Improvements and some new methods.
you can check all new methods and changes to the API at this link.
update: my twitter timeline got something related:
After a discussion on Hacker News regarding the attr boolean changes in jQuery 1.6, we just landed a fix: http://j.mp/j0uMEb
Its good to know also that @jeresig is moving from mozilla to the famous online academy – Khan academy -.
ThankQQ for your time 🙂