by Chris
8. June 2011 14:19

In the newest version of jQuery, 1.6, a new function .prop() was introduced to distinguish the difference between a DOM property and a HTML attribute.
.prop() returns the DOM property, where .attr() returns the HTML attribute. Here's what the differences are.
A HTML attribute, is what is in the HTML. For the following snippet,
<input id="foo" type="text" value="abc">
"abc" is the HTML attribute.
$('input').attr('blah'): returns 'hello' as expected. No suprises here.
$('input').prop('blah'): returns undefined -- because it's trying to do [HTMLInputElement].blah -- and no such property on that DOM object exists. It only exists in the scope as an attribute of that element i.e. [HTMLInputElement].getAttribute('blah')
Its also important to note that as of version 1.6.1, .attr() works the same as it always did.