js 的 $.data() 和 $('div').data() 緩存機制

這兩種方式是有區別的，寫個小例子

...
<div id="people">
</div>
...

// 注意這里是兩個不同的對象   lucy === lily  false
var lucy = $("#people");
var lily = $("#people");

// 分別設置age
lucy.data('age',12);
lily.data('age',13);

lucy.data('age'); // 13（注意）
lily.data('age'); // 13

為什么導致這樣的情況呢？
大家再看一個例子

// 注意這里是兩個不同的對象   lucy === lily  false
var lucy = $("#people");
var lily = $("#people");

$.data(lucy,'age',12);
$.data(lily,'age',13);

$.data(lucy,'age'); // 12（注意）
$.data(lily,'age'); // 13

大家看到了吧，這個地方獲取出來的 lucy age為12 和上面是有區別的，為什么呢？
對於jquery中的封裝，兩個是有區別的。
簡單的來講：（注意這是高能預警）

lucy.data() 是針對dom對象的。
$.data(lucy) 是針對jquery對象的。

實際上對於這兩者而言，其內部實現方法都是一樣的，只不過lucy.data() 在調用底層cache方法的時候，將進行了this[0]處理。
如果要使用$.data來獲取 某個元素的值的話，也是可以的，使用 $.data(lucy[0])
再給大家補充一點：
如果lucy是一個li標簽，那么$("li").data('hello','world') 這個時候，等於給所有的li標簽添加了一個緩存值，名字叫做hello，對應的value 為world。
這個時候再使用$.data(lucy[0]) 來獲取屬性的時候，實際上是獲取整個dom元素中的，第一個li標簽的hello的值world

實際上整個cache過程，主要是Data實例對象的cache