$.data (), $ (). Data

Two methods are similar, but there are differences, simply say:

$.data (): The static method of JQ, i.e. jquery.data () calls directly

$ (). Data (): an instance method with an instance before calling this method, for example: $ ("#id"). Data ("name", "Zhangsan")

Difference:

By example:

var Div1 = $ ("#d1");
var div2 = $ ("#d1");
$.data (Div1, "name", "Zhangsan");
$.data (Div2, "name", "Lisi");
document.write ($.data (DIV1). name);//zhangsan
document.write ($.data (div2). name);//zhangsan

Div1.data ("name", "Zhangsan");
Div2.data ("name", "Lisi");
document.write (Div1.data ("name"));//lisi
document.write (Div2.data ("name"));//lisi

By the way, they define the source, $.extend (), $.fn.extend (); This article is very good, we can look at http://caibaojian.com/jquery-extend-and-jquery-fn-extend.html

$.extend (): Adds a global function, an object, which is equivalent to adding a static method to the jquery class

$.fn.extend (): This is an extension to Jquery.prototype (originally Jquery.fn = Jquery.prototype), which is to add "member function" to the JQuery class

OK, go to the point, first look at the static method: $.data ();

For a few examples:

$.data ($ ("#id"), "name", "Zhangsan");

$.data ({}, "name", "Zhangsan");

$.data ({},{"name", function () {}});

Wait Jquery.extend ({

Data:function (elem, name, data) {return Internaldata (elem, name, data);} ...} Internal method function Internaldata (elem, name, data, PVT */Internal use only */) {
Detects if the Elem can accept data if (!jquery.acceptdata (Elem)) {return;} var thiscache, ret,
Random number, when jquery is loaded, initialize it, expando: "jquery" + (Core_version + math.random ()). Replace (/\d/g, "") Internalkey = Jquery.expand O
Name is a string of type Truegetbyname = typeof name = = = "string",//We have the to handle DOM nodes and JS objects differently because ie6-7//can ' t GC object references properly across the DOM-JS boundary
You must distinguish between handling DOM elements and JS objects, because ie6-7 cannot garbage-Reclaim object-referenced properties across DOM objects and JS objects (this is not a good idea at this time).
Isnode = elem.nodetype,//only DOM nodes need the global JQuery cache; JS Object Data is//attached directly to the object so GC can occur automatically
If it is a DOM node, then the cache takes the JQ global cache, otherwise take elem itself, this is also the static and instance data method of an important difference cache = Isnode? JQuery.cache:elem,//Only defining a ID for JS objects if it cache already exists allows//the code to SHORTCU T on the same path as a DOM node with no cache
If the cache already exists, take it directly, and if it does not exist then Undefinedid = Isnode? elem[Internalkey]: elem[Internalkey] && internalkey;//Avoid doing any more work than we need to when trying To-get data on an//object-have no data at all
The object does not have any data and returns directly if ((!id | |!cache[id] | | (!pvt &&!cache[id].data))　　　　 && getbyname && data = = = undefined) {return;} ID does not exist if (!id) {//Only DOM nodes need a new unique ID for each element since their data//ends up in the global cache
If it is a DOM node, add Internalkey/guid This key value pair to Elem, convenient to call if (Isnode) {elem[Internalkey] = id = core_deletedids.pop () | | | jQuery. guid++;}　　　　 else {//non-dom nodes, such as objects created by themselves {}id = Internalkey;}} Cache[id] does not exist add an empty object if (!cache[id]) {cache[id] = {};//avoids exposing jQuery metadata on plain JS objects when th E object//is serialized using json.stringify
The ToJSON method of Cache[id] prevents this object from being serialized through the ToJSON method, exposing the metadata of jQuery (not quite understood) if (!isnode) {cache[id].tojson = jquery.noop;}} An object can is passed to Jquery.data instead of a key/value pair; This gets//shallow copied over onto the existing cache
If object or function, then shallow clone it to Cache[id] 's Data property if (typeof name = = = "Object" | | typeof name = = = "function") {if (pvt) {cache[id] = Jquery.extend (cache[ID], name);} else {cache[id].data = jquery.extend (cache[ID].data, name);}}  Thiscache = cache[ID];//jQuery data () is stored in a separate object inside the object ' s internal data//cache in order To avoid key collisions between internal data and user-defined//data.
is not an intrinsic element, define the assignment cache-related property if (!PVT) {
Cache[id].data does not exist then creates
if (!thiscache.data) {thiscache.data = {};}　　　　 Remove the data object separately Thiscache = Thiscache.data;} If data is defined here, the Name/data is assigned to the top of cache.data, i.e. cache.data={name:data}if (data!== undefined) {
CamelCase This function is a hump function, which is performed in some case, such as a-and-b-"aandbthiscache[jquery.camelcase (name)] = data;} Check for both Converted-to-camel and non-converted Data property names//If A data property is specified
If name is of type string, the corresponding data value ("Zhangsan") is returned, otherwise the data object in the cache ({Name:funciton () {}}) if (getbyname) {//First Try to find As-is Property Dataret = thiscache[name];//Test for null|undefined property dataif (ret = = null) {//Try to find the camelcased Propertyret = thiscache[jquery.camelcase (name)];}} else {ret = Thiscache;} return ret;}

　　

$.data (), $ (). Data