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. BZOJ1855 [Scoi2010]股票交易 【单调队列优化dp】

    题目链接 BZOJ1855 题解 设\(f[i][j]\)表示第\(i\)天结束时拥有\(j\)张股票时的最大收益 若\(i \le W\),显然在这之前不可能有交易 \[f[i][j] = max\ ...

  2. BFC,IFC,GFC,FFC

    FC的全称是:Formatting Contexts,是W3C CSS2.1规范中的一个概念.它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元素将如何定位,以及和其他元素的关系和相互作用. ...

  3. jquery使用--常见前端效果实现

    一.选中左右侧内容到另一侧:选中左侧内容到右侧,选中右侧内容到左侧 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional/ ...

  4. java equals 与 hashCode

    转:http://m.blog.csdn.net/blog/pengchua/2297547# 如果你为某个类写了equals方法,那么应该同时编写hashCode方法.如果没有提供hashcode方 ...

  5. 接下来打算写一下visual stuido 2013使用git进行远端管理。

    虽然我有了vs的账号,也vs2013开始已经可以进行远端的账户管理了,可是vs的版控毕竟有些依赖vs,想想还是用git吧 今天把这个环境的整套都弄地基本熟了.记录一下,算是一个小结.开始搭建系统框架

  6. Easy Install详细参数

    Easy Install Easy Install is a python module (easy_install) bundled with setuptools that lets you au ...

  7. 流畅的python第九章笔记 python风格的python

    9.1对象表示形式 __repr__和__str__这两个方法都是用于显示的,__str__是面向用户的,而__repr__面向程序员. 我们打印下面的A是默认输出这个对象的类型,我们对B进行了修改_ ...

  8. Appium+python自动化17-启动iOS模拟器APP源码案例【转载】

    前言 上一篇已经可以启动iOS模拟器上的safari浏览器了,启动app比启动浏览器要复杂一点,本篇以github上的源码为案例详细介绍如何启动iOS模拟器的app 一.clone源码 1.githu ...

  9. ubuntu for windows10设置中文

    运行 sudo dpkg-reconfigure locales ,第一个界面是选择区域,找到后面的zh_CN.UTF-8 UTF-8,回车确认,第二个界面是选择语言,选择zh_CN.UTF-8,回车 ...

  10. Codeforces 897 B.Chtholly's request-思维题(处理前一半)

      B. Chtholly's request   time limit per test 2 seconds memory limit per test 256 megabytes input st ...