JQuery constructor init parameter analysis _ jquery

This article mainly introduces the init parameter analysis of the jQuery constructor. Today, we mainly analyze the init selector constructor in jQuery to process the parameters in the selector function, interested friends can understand the analysis of jQuery constructor in my previous article. a prototype method init in the jQuery object is a real constructor, the reference relationship between the init prototype object and the jQuery prototype object allows the init instance to call the jQuery prototype method normally, just like the jQuery instance. Next let's take a look at how the constructors behind init are written:

init: function( selector, context, rootjQuery ) {...}

We can see that this method accepts three parameters. The first two parameters are passed by the jQuery method.

var jQuery = function( selector, context ) {// The jQuery object is actually just the init constructor 'enhanced'return new jQuery.fn.init( selector, context, rootjQuery );},

Selector can input any value in principle, but not all values are meaningful. only undefined, DOM elements, strings, functions, jQuery objects, and common JavaScript objects are valid, this parameter is usually entered, but no error will be reported if it is not entered.

The code is as follows:

Console. log ($ ());
// [Constructor: function, init: function, selector: "", jquery: "1.7.1", size: function…]

Context can be used as the execution Context or the execution range, or either of DOM elements, jQuery objects, or common JavaScript objects.

RootjQuery: The jQuery object that contains the document Object. it is used for document. getElementById () failed to search, selector is a selector expression and context is not specified, selector is a function, in fact, it is $ (document ).

The following are 12 cases based on different parameters.

1. selector can be converted to false

// Handle $(""), $(null), or $(undefined)if ( !selector ) {return this;}

The comments in the source code have been clearly written. when these three conditions are met, direct return is not processed.

2. the selector parameter is a DOM element.

Example: $ (document)

// Handle $(DOMElement)if ( selector.nodeType ) {this.context = this[0] = selector;this.length = 1;return this;}

As long as the dom element must have a node type, the node is converted to the first element of the jquery object and assigned a value to the context. the length attribute is the default value of 0 for the jQuery prototype attribute.

// The default length of a jQuery object is 0

Length: 0,
With an element, the length attribute is changed to 1. The return this operation makes the result of the function execution still a jQuery object so that you can implement chained calls like $ (document). each. The final {0: document, context: document, length: 1 ....} objects, in fact, all the situations will eventually become objects in this form. except for the jQuery prototype attributes and methods, the dom nodes obtained are arranged in sequence according to Arabic numbers, therefore, we can use $ (selector) [0] instead of $ (selector ). get (0) to get the dom object. For example: