Simulation code of jQuery implementation principle -2 Data part_jquery

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 the attribute? Will it conflict with other attributes?
In jQuery, private data extended for DOM objects can be represented by an object, and multiple data can be represented by multiple properties of this object. In order to be able to find this expanded data object through the DOM object without conflicting with other existing properties, the expando constant is used to represent the property name of the expanded object in jQuery, and the value of expando is calculated. The value of this attribute is the key value used to find the extended object.
For example, we can define the value of expando as "jQuery1234", then we can add this attribute named "jQuery1234" to each DOM object. The value of this attribute can be a key, for example, 1000.
The cache on the jQuery object is used to save all object extension objects. This object can be regarded as a dictionary, the attribute name is the key value, and the corresponding value is the extended data object.
In other words, there will be a member 1000 on the cache of the jQuery object, and the object referenced by this member is the private extension object of the DOM object No. 1000. The private data of member 1000 will be stored in this object.
When a DOM object needs to obtain expanded data, it first obtains a key value through the expando attribute of the object, then uses this key value to obtain its own expansion object in jQuery.cache, and then reads and writes data on the expansion object.

Copy code The code is as follows:

///
// Common methods
function now() {
return (new Date).getTime();
}
// Attribute name of expanded data, dynamic Generate to avoid conflicts with existing properties
var expando = "jQuery" now(), uuid = 0, windowData = {};
jQuery.cache = {};
jQuery.expando = expando;
// Data management, you can save private data for DOM objects and read the saved data
jQuery.fn.data = function (key, value) {
// Read
if (value === undefined) {
return jQuery.data(this[0], key);
}
else { // Set
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
// Get the key value of the element to save data
var id = elem[expando], cache = jQuery.cache, thisCache;
// Without id, the value cannot be obtained
if (!id && typeof name === "string" && data === undefined) {
return null ;
}
// Compute a unique ID for the element
// Compute 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
}
// Get 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 saved 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) {
// Traverse the attributes of the element, return false only if the attribute is required, otherwise return true
for (var name in obj) {
return false;
}
return true;
}
// Check if 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 the object.

Copy code The code is as follows:

// 数据操작품
$("#msg").data("name", "Hello, world.");
alert($("#msg").data("이름"));
$("#msg").removeData("이름");
alert($("#msg").data("이름"));