jQuery缓存机制

我们知道，在html标记中，事件处理句柄是作为属性出现在html标记节点上的。在非严格状态下，html标记中也可以嵌入很多自定义属性。而jquery为了实现业务和界面的分离，对于dom元素，构建了一种缓存机制。

首先，页面被使用$选择命中的元素，都会缓存进入到$.cache中。

$.cache是一种哈希表似的数据结构，具备索引机制。当然从js数据层面，$.cache是一个对象，只是其属性是自增的阿拉伯数字标记。即形式如下

$.cache[“0”], $.cache[“1”], $.cache[“2”]

被命中的dom元素都会通过索引对应与如下的对象

{

 $.expendo:{

 },

}

而索引则标记在元素的属性中，通过

dom[$.expendo]即可取到其索引

$.expendo的形式如jQuery15103434303403430

一半会有两个属性，一个是事件对象，一个是事件句柄

以jQuery ui tabs为例，其形成的缓存对象形式如

{

jQuery15107394322659820318: {

                   events: Object，

                   handle: function () {}

         },

tabs: $.widget.basePrototype,

name:”tabs”

}

即元素对应的ui组件对象，通过data添加的数据，都是绑定了该对象上。

jQuery提供的$.data对该对象进行访问。例如

$.data(dom)即可获取其缓存对象

$.data(dom,”events”)即可获取其所有的绑定事件

$.data(dom,name)即可获取缓存对象上对应的name的属性

因为jquery将其转换到了$.fn.data方便链式操作，上面的操作也可以通过

$Object.data()

$Object .data(”events”)

$Object.data(name)

上面只是针对的dom元素，不包括一些特殊元素，例如$.noData中的元素。而js Object的缓存和设置，直接在obj[$.expendo]上面，数据也是在其上面

jQuery15107394322659820318:{

name: 121

toJSON: function () {}

}