Where is jQuery.data() stored?

Where does jQuery store the values of the data() that it sets to DOM objects?

Is there some kind of variable like jQuery.dataDb or something, maybe even something private?

Is there any way to gain access to this object?

$.cache这个是存放了所有的 Jquey.data()设置的值。

Internally, jQuery creates an empty object called $.cache, which is used to store the values you set via the data method. Each DOM element you add data to, is assigned a unique ID which is used as a key in the $.cache object.

https://stackoverflow.com/questions/5821520/where-is-jquery-data-stored

---------------------------------------

测试代码:

<!DOCTYPE html>
<html ng-app="App">
<head>
<meta charset="utf-8"/>
<script src="./js/jquery-1.10.2.js"></script> </head>
<body ng-controller="mainCtrl">
<div>
存储的值为
<span></span>

<span></span>
</div>
<script>
$(function () {
var div = $( "div" )[ 0 ];
jQuery.data( div, "test", {
first: 16,
last: "pizza!"
});
$( "span:first" ).text( jQuery.data( div, "test" ).first );
$( "span:last" ).text( jQuery.data( div, "test" ).last );
})
</script>
</body>
</html>

  

Ok I figured it out.

jQuery.expando contains a string that's appended to each element which is jQuery + new Date()

HTMLElement[jQuery.expando] contains the key to that element's data

jQuery.cache[HTMLElement[$.expando]] contains the data on the element

Here is a demo

----------------------------------------------------------------------------------------------------------------------

jQuery gets or sets data in 3 different ways for 3 different type of object.

For DOM element, jQuery first get a unique id, than create a custom property for element called expando:

var counter = 0;
function uid() {
// only example
return 'jQuery' + counter;
}
function getExpando(element) {
var expando = element['jQueryExpando'];
// for those without expando, create one
if (!expando) {
expando = element['jQueryExpando'] = uid();
}
return expando;
}

On the other hand, jQuery has a $.cache object which stores data map for each element, jQuery searches $.cache by expando and get a data map for certain element, getting or setting data in that map:

function data(element, name, value) {
var expando = getExpando(element);
var map = $.cache[expando]; // get data
if (value === undefined) {
return map && map[name];
}
// set data
else {
// for those without any data, create a pure map
if (!map) {
map = $.cache[expando] = {};
}
map[name] = value;
return value;
}
}

For custom object(which is not DOM element or window object), jQuery directly set or get a property from that object by name:

function data(obj, name, value) {
if (!obj) {
return obj;
}
// get data
if (value === undefined) {
return obj[name];
}
// set data
else {
obj[name] = value;
return value;
}
}

At last, for the special window object, jQuery has a special windowData variable in closure to store data for window:

function data(obj, name, value) {
if ($.isWindow(obj)) {
obj = windowData;
}
// same as data for custom object
}
answered Apr 28 '11 at 17:07
otakustay

6,98612435
 

Jquery.data()的值存放再什么地方的问题?的更多相关文章

  1. jquery data方法取值与js attr取值的区别

    <a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...

  2. jQuery源码解读 - 数据缓存系统:jQuery.data

    jQuery在1.2后引入jQuery.data(数据缓存系统),主要的作用是让一组自定义的数据可以DOM元素相关联——浅显的说:就是让一个对象和一组数据一对一的关联. 一组和Element相关的数据 ...

  3. jQuery.Data源码

    jQuery.data的是jQuery的数据缓存系统.它的主要作用就是为普通对象或者DOM元素添加数据. 1 内部存储原理 这个原理很简单,原本要添加在DOM元素本身的数据,现在被集中的存储在cach ...

  4. 转:jQuery.data

    原文地址:http://www.it165.net/pro/html/201404/11922.html 内存泄露 首先看看什么是内存泄露,这里直接拿来Aaron中的这部分来说明什么是内存泄露,内存泄 ...

  5. jQuery.data的是jQuery的数据缓存系统

    jQuery.Data源码 jQuery.data的是jQuery的数据缓存系统 jQuery.data的是jQuery的数据缓存系统.它的主要作用就是为普通对象或者DOM元素添加数据. 1 内部存储 ...

  6. jQuery.data() 的实现方式,jQuery16018518865841457738的由来,jQuery后边一串数字的由来

    原文地址: http://xxing22657-yahoo-com-cn.iteye.com/blog/1042440 jQuery.data() 的实现方式 jQuery.data() 的作用是为普 ...

  7. jQuery对象数据缓存Cache原理及jQuery.data详解

    网上有很多教你怎么使用jQuery.data(..)来实现数据缓存,但有两个用户经常使用的data([key],[value])和jQuery.data(element,[key],[value])几 ...

  8. jQuery.data() 的实现方式

    jQuery.data() 的作用是为普通对象或 DOM Element 附加(及获取)数据. 下面将分三个部分分析其实现方式:     1. 用name和value为对象附加数据:即传入三个参数,第 ...

  9. jQuery.data() 即($.data())的实现方式

    jQuery.data() 的作用是为普通对象或 DOM Element 附加(及获取)数据.     下面将分三个部分分析其实现方式:     1. 用name和value为对象附加数据:即传入三个 ...

随机推荐

  1. hdu 5111 树上求交

    hdu 5111 树上求交(树链剖分 + 主席树) 题意: 给出两棵树,大小分别为\(n1\),\(n2\), 树上的结点权值为\(weight_i\) 同一棵树上的结点权值各不相同,不同树上的结点权 ...

  2. 2017-7-18-每日博客-关于Linux基本命令CnetOS7系统基本操作命令.doc

    1.root/下 cat  anaconda-ks.cfg 确定是否装base软件组 yum groupinstall base  安装base组ifconfig 命令就可以使用了或者使用ip add ...

  3. linux正则表达式(一)

    正则表达式是一种字符串模式匹配,使用灵活.功能强大,使用简单的方式对字符串进行控制. 1.使用grep进行字符串匹配 测试文本 1.txt helloworld haa !@#$%^&*( A ...

  4. CF888E Maximum Subsequence (Meet in the middle,贪心)

    题目链接 Solution Meet in the middle. 考虑到 \(2^{35}\) 枚举会超时,于是分成两半枚举(尽量平均). 然后不能 \(n^2\) 去匹配,需要用到一点贪心: 将数 ...

  5. DatacontractAttribute的使用规则

    关于DatacontractAttribute的使用规则和说明, DatacontractAttribute是序列化类的另一种方法,和XmlMemberAttribute(也就是XmlElementA ...

  6. 自以为是而已,不知道它是什么 window.onload 放执行

    var $=jQuery=function(onload){window.onload=onload();} jQuery(function(){alert(2);}); $(function(){a ...

  7. 使用select2插件并添加拼音首字母检索

    项目中要使用下拉检索的时候要支持拼音首字母.本来拼音可以写后台,这里放前台了. 放代码 1. pinyin.js ,最后为了使用方便,直接为string对象添加了扩展方法 /* File Create ...

  8. 关于js拖拽功能,拖拽元素的position:fixed;left:0;right:0;样式引起左右拖动元素会出现落后鼠标移动距离的问题

    被拖拽元素的样式如果为:position:fixed;left:0;right:0;(当时是为了让fixed定位的元素水平居中加的left:0;right:0;避免js动态计算定位的麻烦)时左右拖动会 ...

  9. hdu 5144(三分+物理)

    NPY and shot Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tota ...

  10. kylin

    Kylin只能导入扁平化的Hive表,简而言之,其不支持Hive的复杂数据类型,如array.struct.map等