JQuery source code analysis notes (2) Variable list

_ JQuery = window. jQuery;
_ $ = Window. $;
These two variables are the only two global variables used by jQuery. In the jQuery. noConflict () function, the two variables are restored.
For browser detection, jQuery uses UserAgent instead of feature detection.
Rwebkit =/(webkit) [\/] ([\ w.] + )/,
Ropera =/(opear )(? :. * Version )? [\/] (\ W + )/,
Rmsie =/(msie) ([\ w.] + )/,
Rmozilla =/(mozilla )(? :.*? Rv :( [\ w.] + ))? /,
Init
JQuery's processing of JS objects is bypassed, and the ultimate goal is to convert the result of the jQuery selector into an object similar to the array. Such as length, first, and last. Because $ ("...") is to select some nodes from the DOM tree. However, $ has many other functions, such as $ (function (){...}) used for page initialization after loading, $ ("<...>... </...> ") to directly obtain a node for append to the DOM tree.
The next step is a long init function starting from line 93. Init: function (selector, context, rootjQuery)
Steps:
1. Selector is an invalid parameter. If it is null or undefined, this is directly returned. There are jQuery objects with default attributes.
2. Selector is DOMElement. That is, elements obtained by using native JS such as getElementById. Then, it is equivalent to wrapping the native DOM object with $. Place this element in the first position of the internal array and set the length to 1. Then return.
3. Special optimization processing $ ("body "). That is, the document. body element.
4. Selector is a string starting with <and ending with>. Assume that you want to create a DOM element with a string. For example, $ ("<a href = 'HTTP: // www.cnblogs.com"> blog </a> "). For the sake of security, a regular expression is used to check whether the regular expression is in the form of <...>... </...> or # id.
QuickExpr =/^ (? : [^ <] * (<[\ W \ W] +>) [^>] * $ | # ([\ w \-] *) $ )/. After quickexpr.exe c (selector), if it is an HTML string, it will get [match, match, undefined], and the # id form will get the result of [# id, undefined, id. In this way, the strings are differentiated.
For HTML strings, if there is only one tag, createElement is called directly. Otherwise, a createFragment auxiliary function is called, which uses createDocumentFragment and inserts all tags.
CreateFragment is implemented in row 5892. Here, jQuery caches HTML fragments. In addition, different browsers and metadata are processed differently. The author wrote a large comment. In summary, (1) only small fragments smaller than Kb are cached. (2) The selected status is not cached. (3) The <object> and <embed> elements of IE6 are not cached. (4) WebKit does not cache the checked attribute of elements. The reason for the above non-cache is that jQuery uses the Clone Node Method for caching, and 2-4 mentioned the situation will be lost during Clone. JQuery uses regular expressions or jQuery. support auxiliary functions to determine whether to cache policies. Skip this step. JQuery. support involves many browser problems.
5. If the # id is found in 4, you can directly call document. getElementById
6. If selector is a function, this function is treated as an event handler of document. ready.
7. For example, context is introduced. Call a single find (selector) for processing. This function will be discussed later. (Row 3, jQuery. find = Sizzle; jQuery. expr = Sizzle. selectors; indicates that other complex selector expressions are thrown to the Sizzle project)
Basic jQuery Member
JQuery is designed to act like an array. Therefore, some conversion methods and basic attributes are required.
1. jquery: version number. The simplest way to get the version number: $ (). jquery
2. length and size (): length.
3. toArray (): Convert to JS Array
4. get (num): returns the nth element. If null is input, the result of toArray () is returned directly. DOMElement is returned here.
5. pushStack (): see http://api.jquery.com/pushStack. A new jQuery object is added internally. Then, the results obtained by elems and selector are merged and the new jQuery object is returned. Here is the setting of the prevObject attribute. Let's look at the end () function.
6. each (callback, args): traverses elements in the array. $. Each Utiltiy is called internally.
7. ready (fn): Actually, it is equivalent to $ (function.
8. eq (I): I allows positive and negative numbers, and returns a jQuery object, only one element. In fact, it is only the packaging of slice.
9. first () and last (): Actually, eq (0) and eq (-1) are simple packages.
10. slice (): obtain a reference to a part of the array based on parameters. Implemented Using pushStack internally. Therefore, a new jQuery object is returned.
11. map (callback): Calls callback for each element in sequence. Map the array of Element A to the array of Element B. Callback is the ing function of element A-> element B. A basic concept in functional programming (FP.
12. end (): see http://api.jquery.com/end. This is the previous status of the returned selector. The returned result is the jQuery. prevObject attribute. This attribute is set in the pushStack function. Before returning a new jQuery object, it sets the prevObject of the new object to this. In this way, multiple pushStack operations become a chain ). And end () is to move a node along the linked list. After selector, the root prevObject is document. For example, $ ("body div"). prevObject is Document.
Extend Functions
After jQuery basic members, all other members are added with extend. Statement:
JQuery. extend = jQuery. fn. extend = function (){}
Assign all the attributes of all object parameters after target to target. If the first parameter is a boolean value, it is used to specify whether to copy objects in depth. Then, the modified target is returned (not a new object, and the extend function directly modifies the original object ).