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. Snakes and Ladders LightOJ - 1151( 概率dp+高斯消元)

    Snakes and Ladders LightOJ - 1151 题意: 有100个格子,从1开始走,每次抛骰子走1~6,若抛出的点数导致走出了100以外,则重新抛一次.有n个格子会单向传送到其他格 ...

  2. 封装的方法--读取任何路径下的properties文件中的值

    概述:我们在做项目时,经常需要从某个properties文件中读取properties文件中的值.现在我封装了一下方法,直接读取配置文件中的值. 代码如下所示: /** * Created by qi ...

  3. webpack最佳入门实践系列(3)

    6.使用图片 6.1.尝试在css中引入图片 在src目录下新建css文件夹,并且在css文件夹下创建app.css文件,在src目录下新建images文件夹,放入一张图片,在app.css中引入这张 ...

  4. POJ 2676 数独+dfs深搜

    数独 #include "cstdio" #include "cstring" #include "cstdlib" #include &q ...

  5. sh脚本变量赋值时同时执行命令时的环境问题

    在v2ex看到一个问题: 允许在一个命令之前立即发生一个或多个变量赋值,这些赋值为跟随着的命令更改环境变量,这个赋值的影响是暂时的. 那为什么: int=100 int=10 echo $(($int ...

  6. cordova学习:事件Events

    deviceready: 当cordova完全加载,可以调用cordova API接口 支持平台:Amazon.Fire OS.Android.BlackBerry 10.iOS.Tizen.Wind ...

  7. js-禁止微信H5页面点击右上角菜单时出现“复制链接”,且分享仅支持微信分享

    禁止微信H5页面点击右上角菜单时出现“复制链接”,这个问题已经影响到我很久很久了,起码有2年了, 昨天写H5活动的时候,需求有一个是:可分享,但是禁止复制活动链接, 这一下,就逼我务必好好研究研究了. ...

  8. js百度地图-简单的1个坐标点

    要学习百度地图,最好的地方就是去看百度地图API: 案例: <!DOCTYPE html> <html> <head> <meta http-equiv=&q ...

  9. 多层代理获取用户真实IP

    1. 几个概念remote_addr:如果中间没有代理,这个就是客户端的真实IP,如果有代理,这就是上层代理的IP.X-Forwarded-For:一个HTTP扩展头,格式为 X-Forwarded- ...

  10. 洛谷 P4538 收集邮票

    题目描述 有n种不同的邮票,皮皮想收集所有种类的邮票.唯一的收集方法是到同学凡凡那里购买,每次只能买一张,并且买到的邮票究竟是n种邮票中的哪一种是等概率的,概率均为1/n.但是由于凡凡也很喜欢邮票,所 ...