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對象，但是內部的處理確有本質的區別。

通過代碼對比，參考右邊代碼：