jQuery 或者 原生中，缓存数据使用
data
全局的data方法
- 一个全新的 Data 构造函数，uid用来标识生成的每个 Data 实例
function Data() {
this.expando = jQuery.expando + Data.uid++;
}
Data.uid = 1;
-
jQuery.expando每加载一次jQuery就会生成一次新的标记
jQuery.extend({
expando: "jQuery" + ( version + Math.random() ).replace( /\D/g, "" )
})
- 每个 Data 实例，使用
uid和jQuery.expando生成属于自己实例的expando。expando属性值很长，这是为避免元素上属性名的命名冲突 - 无论jQuery对象还是元素，在其上开辟一个属性为
expando 属性值的空间
// 这里 owner 就是 jqueryEle或者对象
owner[ this.expando ] = value;
- 将所有的名称变成驼峰,在该空间上存取
- 生成的私有属性，
$._data()，这个是基于dataPriv操作。
局部data方法
-
jQuery.fn.data方法有自己的逻辑
- 不传参数的获取
jqEle.data()，先从dataUser上取 - 设置多个属性
jqEle.data({role: "name", password: 1111})，也是在dataUser上设置 - 普通的获取
jqEle.data("role")，先从dataUser上取，没有，再从HTML上取 - 设置
jqEle.data("role","name")设置在dataUser上
-
jQuery.fn.removeData和全局的$.removeData逻辑一致
区别
由于逻辑上有一定的，导致使用上有一定的区别
- 取值的不同
<div id="dd" data-role="test">This is div.</div>
var divEle = $('#dd');
// 获取
console.log($.data(divEle,"role")); // undefined
console.log(divEle.data("role")); // test
- 设置的不同
- 全局操作的
ele是jqueryElement，即使原生是同一个，也可以生成不同的jqueryElement - 局部操作的ele是HTML元素，也就是
jqueryElement[0]
var aa1=$("#aaron");
var aa2=$("#aaron");
// 第一组
aa1.data('a',1111);
aa2.data('a',2222);
aa1.data('a') //结果222222
aa2.data('a') //结果222222
// 第二组
$.data(aa1,"b","1111")
$.data(aa2,"b","2222")
$.data(aa1,"b") //结果111111
$.data(aa2,"b") //结果222222
- 无法删除原生上
data相关属性
var divEle = $('#dd');
console.log(divEle.data('role')); // test
divEle.removeData('role');
console.log(divEle.data('role')); // test
