Simulation code of jQuery principles-2 Data Section

Previous:Simulation code of jQuery principles-1 core part

In jQuery, private data can be stored for each DOM object.

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.

1 // <reference path = "jQuery-core.js"/>
2
3 // common methods
4 function now (){
5 return (new Date). getTime ();
6}
7
8 // expand the attribute name of the data and dynamically generate it to avoid conflicts with existing attributes
9 var expando = "jQuery" + now (), uuid = 0, windowData = {};
10 jQuery. cache = {};
11 jQuery. expando = expando;
12
13 // data management, which can store private data for DOM objects and read stored data
14 jQuery. fn. data = function (key, value ){
15
16 // read
17 if (value = undefined ){
18 return jQuery. data (this [0], key );
19}
20 else {// set
21
22 this. each (
23 function (){
24 jQuery. data (this, key, value );
25}
26 );
27}
28}
29 // remove data and delete the data stored on the object
30 jQuery. fn. removeData = function (key ){
31 return this. each (function (){
32 jQuery. removeData (this, key );
33 })
34}
35
36
37 // save data for the element
38 jQuery. data = function (elem, name, data) {/// #1001
39
40 // obtain the key value of the element to save the data
41 var id = elem [expando], cache = jQuery. cache, thisCache;
42
43 // if no id is available, the value cannot be set.
44 if (! Id & typeof name = "string" & data = undefined ){
45 return null;
46}
47
48 // Compute a unique ID for the element
49 // calculate a unique key value for the element
50 if (! Id ){
51 id = ++ uuid;
52}
53
54 // if it has not been saved
55 if (! Cache [id]) {
56 elem [expando] = id; // Save the key value on the element
57 cache [id] ={}; // create an object on the cache to save the value corresponding to the element
58}
59
60 // obtain the data object of this element
61 thisCache = cache [id];
62
63 // Prevent overriding the named cache with undefined values
64 // Save the value
65 if (data! = Undefined ){
66 thisCache [name] = data;
67}
68
69 // return the corresponding value
70 return typeof name = "string "? ThisCache [name]: thisCache;
71
72}
73
74 // Delete the stored data
75 jQuery. removeData = function (elem, name) {/// #1042
76
77 var id = elem [expando], cache = jQuery. cache, thisCache = cache [id];
78
79 // If we want to remove a specific section of the element's data
80 if (name ){
81 if (thisCache ){
82 // Remove the section of cache data
83 delete thisCache [name];
84
85 // If we 've removed all the data, remove the element's cache
86 if (jQuery. isEmptyObject (thisCache )){
87 jQuery. removeData (elem );
88}
89}
90
91 // Otherwise, we want to remove all of the element's data
92} else {
93
94 delete elem [jQuery. expando];
95
96 // Completely remove the data cache
97 delete cache [id];
98}
99}
100
101 // check whether the object is empty
102 jQuery. isEmptyObject = function (obj ){
103 // traverses the attributes of an element. If the attribute is required, false is returned. Otherwise, true is returned.
104 for (var name in obj ){
105 return false;
106}
107 return true;
108
109}
110
111 // check whether it is a function
112 jQuery. isFunction = function (obj ){
113 var s = toString. call (obj );
114 return toString. call (obj) === "[object Function]";
115}
116

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

1 // data operations
2 $ ("# msg"). data ("name", "Hello, world .");
3 alert ($ ("# msg"). data ("name "));
4 $ ("# msg"). removeData ("name ");
5 alert ($ ("# msg"). data ("name "));

Original article: http://www.cnblogs.com/haogj/archive/2010/08/01/1789715.html