Analysis of Noconflict () usages in jquery _jquery

This example describes the Noconflict () usage in jquery. Share to everyone for your reference. The specific analysis is as follows:

JQuery uses the "$" operator by default, and the $ symbol is just a reference to the Window.jquery object, Jquery.noconflict (), which gives control of the variable $ to the first library that implements it. This helps ensure that jquery does not conflict with the $ objects of other libraries. After you run this function, you can only access the jquery object using the jquery variable. For example, where you want to use the $ ("Div p"), you must change to jquery ("Div p").

One, "$" operator

1, jquery by default using the "$" operator, prototype and other frameworks is also the use of "$", so if jquery is introduced after the other libraries, then jquery will get "$" right to use. Such a situation is also very easy to understand, after all, JS is from the top to the dirty type of execution.

2. If you introduce jquery before other libraries that use "$", then jquery will not occupy "$".

Tip: This method is useful when other JavaScript libraries use $ for their functions.

We get a variable in jquery that uses $, but there are a lot of plug-ins that can use the $ symbol, and if we're referencing it, it's going to cause problems, and jquery introduced Noconflict to prevent it from happening.

Ii. definition of Jquery.noconflict

The Jquery.noconflict method contains an optional Boolean parameter that determines whether to hand over the JQuery object itself at the same time as transferring the $ reference:

Jquery.noconflict ([RemoveAll])

Description of the function:

By default, execution Noconflict transfers control of the variable $ to the first library that produces $, and when RemoveAll is set to true, execution noconflict transfers control of the $ and JQuery objects themselves to the first library that generates them.

Third, jquery.noconflict source analysis

At the beginning of the jQuery source, one of the first things to do is this:

Map over JQuery into case of overwrite
_jquery = window.jquery,
//Map over the $ in case of overwrite
_$ = w indow.$,

It is easy to understand that jquery maps jquery and $ two objects in the window environment with two private variables to prevent the variables from being forcibly overwritten. Once the Noconflict method is invoked, the difference between the _jquery, _$, JQuery, and $ four is used to determine how the control is transferred, with the following specific code:

Noconflict:function (deep) {
 if (window.$ = = jQuery) {
 window.$ = _$;
 }
 if (deep && window.jquery = = jQuery) {
 window.jquery = _jquery;
 }
 return jQuery;
}

Then look at the problem of parameter setting above, if Deep is not set, _$ overwrite window.$, at this time jquery alias $ invalid, but jquery itself intact. If there is another class library or code redefining the $ variable, its control is completely handover. Conversely, if deep is set to True, _jquery overrides Window.jquery, at which point $ and jQuery are invalidated.
The benefit of this operation is that, whether it is a framework mix or a highly conflicting execution environment with multiple versions of JQuery, the conflict can be resolved by variable mapping because of the handover mechanism provided by the Noconflict method and the return of the jquery object that is not overwritten.

Iv. Examples of jquery.noconflict

1. Map the $ referenced object back to the original object:

Jquery.noconflict ();
JQuery ("div p"). Hide (); Use JQuery
$ ("content"). Style.display = "none";//Use $ () from other libraries 

2, restore use alias $, and then create and execute a function, in the scope of this function will still be $ as the alias of JQuery to use. In this function, the original $ object is not valid. This function is useful for most plug-ins that do not depend on other libraries:

Jquery.noconflict ();
(function ($) { 
 $ (function () {
  //code using $ as the jQuery alias
 );
}) (jQuery);
...//other libraries with $ alias as the code

3. Jquery.noconflict () can be combined with abbreviated ready to make the code more compact:

Jquery.noconflict () (function () {
  //code using JQuery
});
...//Other libraries use $ to alias code

4. Create a new alias to use the JQuery object in the following libraries:

var j = jquery.noconflict ();
J ("Div p"). Hide ();  JQuery based code
$ ("content"). Style.display = "none";//$ () code based on other libraries

5. Move JQuery completely to a new namespace:

var dom = {};
Dom.query = Jquery.noconflict (true);
Result:
dom.query ("div p"). Hide ();  New JQuery code
$ ("content"). Style.display = "None";  Another library $ () code
jQuery ("div > P"). Hide ();  Another version of JQuery's code

I hope this article will help you with your jquery programming.