.prop () compared to .data ()

Question

With the new version of jQuery v1.6 and the addition of the .prop() method.

Is there an inherent difference in using .prop() over .data() ?

In the documentation, I see that not deleting a property can lead to memory leaks in versions of IE prior to IE9. But are there any other performance issues or other issues using the new prop() method?

Syntax from the site:

 var $para = $("p"); $para.prop("luggageCode", 1234); 

Further:

 var $para = $("p"); $para.data("luggageCode", 1234); 

Answer 1

I believe prop is for setting the correct properties of an HTML document, not for arbitrary data. I suggest that you continue to use the data for information such as baggage.

Answer 2

I think this boils down to the difference between the DOM Node property and the property of the Javascript object that represents it.

The documentation does not indicate how and where .data() data is stored, so the fact that you see it as a property of the corresponding jQuery object may just be an implementation detail. jQuery will be allowed to store it in a completely different place.

In contrast, .prop() , of course, directly refers to the properties of the DOM Node.

Answer 3

Maybe I'm wrong, but it seems that .data() can be enumerated, and .prop() cannot .

Live demo

 var $p = $("<p>"); $p.data('luggagecode', '12345'); $p.data('luggagecode_backup', '54321'); for (var key in $p.data()) { // generates two alerts var value = $p.data(key); alert('DATA | '+key+' = '+value); } var $p2 = $("<p>"); $p2.prop('luggagecode', '12345'); $p2.prop('luggagecode_backup', '54321'); for (var key in $p2.prop()) { // no alerts var value = $p2.prop(key); alert('PROP | '+key+' = '+value); }