作为你在 jQuery 的工作进展， As your work with jQuery progresses, 你将发现这里常有一些你准备作为元素要存储的数据。you'll find that there's often data about an element that you want to store with the element. 在 JavaScript 里，In plain JavaScript, 你可能直接将属性加入到 DOM 元素中，you might do this by adding a property to the DOM element, 但是你必须处理在一些浏览器中的内存泄露。but you'd have to deal with memory leaks in some browsers. jQuery 提供了一个简洁的方法存储相关数据到元素中，它帮你管理内存问题。offers a straightforward way to store data related to an element, and it manages the memory issues for you.
Example 4.2. 存储和检索一个元素的相关数据
$('#myDiv').data('keyName', { foo : 'bar' });
$('#myDiv').data('keyName'); // { foo : 'bar' }
你能存储一个元素任何种类的数据，当你进行一个复杂应用开发时它们的重要性难以用语言表达
。这一课的目的，我们将使用 $.fn.data 来存储其它元素的引用。
在这的例子中，我们可能需要在一组列表项和它的内部划分上建立一种关系。我们建立的这个关系在每一个单独时间里与这些条目相互作用，但是一个更好的解决方案是一旦这个关系创建好，通过使用$.fn.data: 来存储划分条目的指针and then store a pointer to
the div on the list item using $.fn.data:
Example 4.3. 使用 $.fn.data 存储元素之间的关系
$('#myList li').each(function() {
var $li = $(this), $div = $li.find('div.content');
$li.data('contentDiv', $div);
});
// 后来，我们不得不再一次发现 div；
// 我们能从列表项中读取到它
var $firstLi = $('#myList li:first');
$firstLi.data('contentDiv').html('new content');
除了传递 $.fn.data 一个 key-value 对到存储数据外，你也能传递一个包含一个或更多键值对的对象。
Copyright Rebecca Murphey, released under the Creative Commons Attribution-Share Alike 3.0 United States license.