Reading jQuery's six cached data Functions

Many users prefer to store data on the HTMLElement attribute in projects, such
Copy codeThe Code is as follows:
<Div data = "some data"> Test </div>
<Script>
Div. getAttribute ('data'); // some data
</Script>

Added the custom property "data" and value "some data" to the div on the page ". Use getAttribute in subsequent JS Code.
JQuery provides the data/removeData method from 1.2.3 to store/delete data. 1.6.1 code snippet
Copy codeThe Code is as follows:
JQuery. extend ({
Cache :{},
// Please use with caution
Uuid: 0,
...
});

That is, a static field/method is added to jQuery, including jQuery. cache/jQuery. uuid/jQuery. expando. The following describes
Empty jQuery. cache object for caching. Its structure is complex.
The unique number of jQuery. uuid auto-increment.
The jQuery. expando string is generated using Math. random and non-numeric characters are removed. It serves as the attribute name of the HTMLElement or JS object.
Copy codeThe Code is as follows:
Expando: "jQuery" + (jQuery. fn. jquery + Math. random (). replace (/\ D/g ,""),

The jQuery. noData JS object that disables the data method for the specified HTMLElement. Such as embed and applet.
JQuery. hasData is used to determine whether an HTMLElement or JS object has data. Returns true or false. That is, if the jQuery. data method is called to add attributes, true is returned.
Copy codeThe Code is as follows:
<Div> aa </div>
<Script>
Var div = document. getElementsByTagName ('div ') [0];
$. HasData (div); // false
$. Data (div, 'name', 'jack ');
$. HasData (div); // true
</Script>

JQuery. acceptData is used to determine whether the element can accept data. true or false is returned. Used in jQuery. data.
JQuery. data this is a method provided for client programmers. It is also setter/getter.
1. Pass a parameter to return all data appended to the specified element, that is, thisCachejQuery. data (el); // thisCache
2. pass two parameters and return the specified property value jQuery. data (el, 'name ');
3. Input three parameters to set the attributes and attribute values. jQuery. data (el, 'name', 'jack'); jQuery. data (el, 'uu ',{});
4. pass four parameters. The fourth parameter pvt is only available for the jQuery library. That is, true is passed in the jQuery. _ data method. Because jQuery's event module is heavily dependent on jQuery. data, it is added to this version to avoid accidental rewriting.
JQuery. removeData deletes data.
The above is the overall overview of the jQuery data cache module. The following describes the jQuery. data method in detail. JQuery. data provides cache for two types of objects: JS object and HTMLElement
Copy codeThe Code is as follows:
// Provide cache for JS objects
Var myObj = {};
$. Data (myObj, 'name', 'jack ');
$. Data (myObj, 'name'); // jack
// Provide cache for HTMLElement
<Div id = "xx"> </div>
<Script>
Var el = document. getElementById ('xx ');
$. Data (el, 'name', 'jack ');
$. Data (el, 'name'); // jack
</Script>

There are also differences in internal implementation,
1. When cache is provided for JS objects, data is directly stored on JS objects. Cache is a JS object. In this case, a property (similar to jquery1610180109874529044) is secretly added to the JS object, and the property value is also a JS object. Example
Copy codeThe Code is as follows:
Var myObj = {};
$. Data (myObj, 'name', 'jack ');
Console. log (myObj );

The structure of myObj is as follows:
Copy codeThe Code is as follows:
MyObj = {
Jquery1610180109874529044 :{
Name: 'jack'
}
}

The string "jquery1610180116874529044" is named as id in data (note that it is not the id of the HTMLElement). It is actually jQuery. expando. As mentioned above, it is randomly generated after jQuery. js is introduced to the page.
2. When cache is provided for HTMLElement, it is not directly stored on HTMLElement. It is saved on jQuery. cache. The cache is jQuery. cache. Add an attribute (similar to jquery1610180109874529044) to HTMLElement first. The attribute value is a number (1, 2, 3 ). That is, only some numbers are saved on HTMLElement, and data is not directly placed. This is because there may be a risk of Memory leakage in older IE versions. How does HTMLElement interact with jQuery. cache? Or id. The attribute value is id. Example
Copy codeThe Code is as follows:
<Div id = "xx"> </div>
<Script>
Var el = document. getElementById ('xx ');
$. Data (el, 'name', 'jack ');
Console. log (el [jQuery. expando]); // 1
Console. log (jQuery. cache); // {1: {name: 'jack '}}
</Script>

The attribute jQuery. expando is added to el and the value is id. This id increases progressively from 1. And id is used as the property (key) of jQuery. cache ). In this way, HTMLElement is connected with jQuery. cache.

I do not know whether this parameter exists. jQuery. data has the fourth pvt parameter, which is only used in jQuery. _ data.
Copy codeThe Code is as follows:
// For internal use only.
_ Data: function (elem, name, data ){
Return jQuery. data (elem, name, data, true );
},

JQuery. _ data specifies that it is private from the name. Client programmers using jQuery should not call this method. JQuery's API documentation will not disclose it.
Almost every version of jQuery's data cache module is changing from 1.2.3 to 1.6.1. JQuery. _ data is proposed to prevent the client programmer from overwriting/rewriting the write module. For example, the event handler in the jQuery event module uses jQuery. data Storage. If this module is overwritten. The event module is paralyzed. Therefore, the pvt parameter and the jQuery. _ data method are added.
But if you want to destroy it, you can still do it. As follows:
Copy codeThe Code is as follows:
<Div id = "xx"> Test </div>
<Script>
$ ('# Xx'). click (function (){
Alert ('click ');
});
// Statement 1
$. Data ($ ('# xx') [0], 'events', '', true );
// Statement 2
// $. _ Data ($ ('# xx') [0], 'events ','');
</Script>

Clicking div [id = xx] will not trigger the click event.
The entire process of jQuery. data setting (set) data caching is like this. The process of getting data is easy to understand. No duplicates.
Finally, I will add the zChain. data/removeData method to zChian. js. Because it is a "mini version", I only add data cache to HTMLElement. Note.

Related:
Http://msdn.microsoft.com/en-us/library/Bb250448
Http://bugs.jquery.com/ticket/6807
ZChain-0.6.js