Simulation code of jQuery implementation principle-2 Data Section

Of course, this data must be accessed through attributes. But what if there are multiple attributes ?, Do you want to define multiple attributes ?, What is the name of an attribute? Will it conflict with other attributes?
In jQuery, the private data extended for DOM objects can be represented by one object. Multiple data are represented by multiple attributes of this object. In order to be able to find this extended data object through the DOM object without conflicting with other existing attributes, the expando constant in jQuery indicates the property name of the extended object, the expando value is calculated. The value of this attribute is used to find the key value of the extended object.
For example, we can define the expando value as "jQuery1234". Then, we can add the property "jQuery1234" to each DOM object. The value of this property can be a key, for example, 1000.
The cache on the jQuery object is used to save all the extended objects of the object. This object can be seen as a dictionary. The attribute name is the key value, and the corresponding value is the extended data object.
That is to say, there will be a 1000 member in the cache of the jQuery object. The referenced object of this Member is the private extension object of the DOM object No. 1000. The private data of the 1000 member will exist on this object.
When a DOM object needs to obtain extended data, it first obtains a key value through the expando attribute of the object, and then uses the key value to jQuery. get your own extension object in the cache, and then read and write data on the extension object.
Copy codeThe Code is as follows:
// <Reference path = "jQuery-core.js"/>
// Common method
Function now (){
Return (new Date). getTime ();
}
// Expand the attribute name of the data and dynamically generate it to avoid conflicts with existing attributes
Var expando = "jQuery" + now (), uuid = 0, windowData = {};
JQuery. cache = {};
JQuery. expando = expando;
// Data management, which can store private data for DOM objects and read stored data
JQuery. fn. data = function (key, value ){
// Read
If (value = undefined ){
Return jQuery. data (this [0], key );
}
Else {// settings
This. each (
Function (){
JQuery. data (this, key, value );
}
);
}
}
// Remove data and delete the data stored on the object
JQuery. fn. removeData = function (key ){
Return this. each (function (){
JQuery. removeData (this, key );
})
}

// Save data for the element
JQuery. data = function (elem, name, data) {// #1001
// Obtain the key value of the element to save the data
Var id = elem [expando], cache = jQuery. cache, thisCache;
// If no id is available, the value cannot be set.
If (! Id & typeof name = "string" & data = undefined ){
Return null;
}
// Compute a unique ID for the element
// Calculate a unique key value for the element
If (! Id ){
Id = ++ uuid;
}
// If it has not been saved
If (! Cache [id]) {
Elem [expando] = id; // Save the key value on the element
Cache [id] ={}; // create an object on the cache to save the value corresponding to the element
}
// Obtain the data object of this element
ThisCache = cache [id];
// Prevent overriding the named cache with undefined values
// Save the value
If (data! = Undefined ){
ThisCache [name] = data;
}
// Return the corresponding value
Return typeof name = "string "? ThisCache [name]: thisCache;
}
// Delete the stored data
JQuery. removeData = function (elem, name) {/// #1042
Var id = elem [expando], cache = jQuery. cache, thisCache = cache [id];
// If we want to remove a specific section of the element's data
If (name ){
If (thisCache ){
// Remove the section of cache data
Delete thisCache [name];
// If we 've removed all the data, remove the element's cache
If (jQuery. isEmptyObject (thisCache )){
JQuery. removeData (elem );
}
}
// Otherwise, we want to remove all of the element's data
} Else {
Delete elem [jQuery. expando];
// Completely remove the data cache
Delete cache [id];
}
}
// Check whether the object is empty
JQuery. isEmptyObject = function (obj ){
// Traverses the attributes of an element. If the attribute is required, false is returned. Otherwise, true is returned.
For (var name in obj ){
Return false;
}
Return true;
}
// Check whether it is a function
JQuery. isFunction = function (obj ){
Var s = toString. call (obj );
Return toString. call (obj) === "[object Function]";
}


The following script can save or read the extended data of an object.

Copy codeThe Code is as follows:
// Data operations
$ ("# Msg"). data ("name", "Hello, world .");
Alert ($ ("# msg"). data ("name "));
$ ("# Msg"). removeData ("name ");
Alert ($ ("# msg"). data ("name "));