jQuery从1.2.3版本引入数据缓存系统，主要的原因就是早期的事件系统 Dean Edwards 的 ddEvent.js代码带来的问题：

1.没有一个系统的缓存机制，它把事件的回调都放到EventTarget之上，这会引发循环引用
2.如果EventTarget是window对象，又会引发全局污染不同模块之间用不同缓存变量

一般jQuery开发，我们都喜欢便捷式的把很多属性，比如状态标志都写到dom节点中,也就是HTMLElement。

好处 : 

直观，便捷。

坏处 ：

1.循环引用
2.直接暴露数据，安全性？
3.增加一堆的自定义属性标签，对浏览器来说是没意的
4.取数据的时候要对HTML节点做操作

jQuery缓存系统的真正魅力在于其内部应用中，动画、事件等都有用到这个缓存系统。试想如果动画的队列都存储到各DOM元素的自定义属性中，这样虽然可以方便的访问队列数据，但也同时带来了隐患。如果给DOM元素添加自定义的属性和过多的数据可能会引起内存泄漏，所以要尽量避免这么干。

A.允许我们在DOM元素上附加任意类型的数据,避免了循环引用的内存泄漏风险
B.用于存储跟dom节点相关的数据，包括事件，动画等
C.一种低耦合的方式让DOM和缓存数据能够联系起来

对于jQuery来说，数据缓存系统本来就是为事件系统服务而分化出来的，到后来，它的事件克隆乃至后来的动画列队实现数据的存储都是离不开缓存系统，所以数据缓存也算是jQuery的一个核心基础了。

jQuery的数据缓存接口：

jQuery.data( element, key, value )
.data( )

对于jQuery.data方法，原文如下：

The jQuery.data() 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 set several distinct values for a single element and retrieve them later:

在jQuery的官方文档中，提示用户这jQuery.data()是一个低级的方法，应该用.data()方法来代替。$.data( element, key, value )可以对DOM元素附加任何类型的数据，但应避免循环引用而导致的内存泄漏问题。

二者都是用来在元素上存放数据也就平时所说的数据缓存,都返回jQuery对象，但是内部的处理确有本质的区别。

通过代码对比，参考右边代码：