<pclass="arguement"><strong>obj</strong>An object of key-value pairs of data to set.</p>
</li>
</ul>
<divclass="longdesc">
<p>The <code>.data()</code> method allows us to attach data of any type to DOM elements in a way that is safe from circular references and therefore from memory leaks.</p>
<p> We can set several distinct values for a single element and retrieve them later:</p>
<p>Setting an element's data object with <code>.data(obj)</code> replaces all data previously stored with that element. If you are using third-party plugins it may not be advisable to completely replace the element's data object, since plugins may have also set data. Until jQuery 1.4.2, jQuery itself used the <code>.data()</code> method to save information about events that have been bound to the element, using a data item named 'events'.</p>
<pre>
$('body').data('foo', 52);
$('body').data({one: 1, two: 2});
$('body').data('foo'); // undefined
$('body').data(); // {one: 1, two: 2}
</pre>
<p>Due to the way browsers interact with plugins and external code, the <code>.data()</code> method cannot be used on <code><object></code>, <code><applet></code> or <code><embed></code> elements.</p>
<p>The <code>.data()</code> method allows us to attach data of any type to DOM elements in a way that is safe from circular references and therefore from memory leaks. We can retrieve several distinct values for a single element one at a time, or as a set:</p>
<pre>
alert($('body').data('foo'));
alert($('body').data());
</pre>
<p>The above lines alert the data values that were set on the <code>body</code> element. If nothing was set on that element, an empty string is returned:</p>
<p>Calling <code>.data()</code> with no parameters retrieves all of the values as a JavaScript object. This object can be safely cached in a variable as long as a new object is not set with <code>.data(obj)</code>.</p>