An effective way to resolve jquery version conflicts_jquery

Friends who have used jQuery know that different versions of jQuery can cause conflicts. This article proposes effective solutions to this problem as follows:

Case: Resolve the conflict between jQuery 1.3.2 and 1.4.2. (This example has been tested and passed!)

Step one: Add a sentence at the end of the 1.4.2 source code:

var $j4 = jQuery.noConflict(true);

The reason why I add it here in the source code instead of adding it when it is used as mentioned in most articles is because many plug-ins based on 1.4.2 need to be added. Adding it here can avoid adding too many plug-ins. Sentence code leads to duplication. This sentence gives up all the reference permissions of jQuery and $ in 1.4.2. That is to say, plug-ins based on 1.4.2 can no longer use jQuery and $. At the same time, give a new namespace to $j4. Note that it is an attribute of window. If you look at the source code of 1.4.2, you will find that it actually executes these two sentences:

window.$=_$;
window.jQuery=_jQuery;

The principle is the same as window.$=_temp$ (returning the namespace), but the naming is different.

Step 2: Add the following code to the head of all plug-ins based on the 1.4.2 framework:

var _temp$ = window.$,_tempjQuery = window.jQuery;

Put jQuery1.3.2’s $ and jQuery into the temporary variable space:

window.$ = $j4;

This sentence and the sentence below are all for the middle code to use jQuery and $ correctly. The following $j4 is to give them the correct reference.

window.jQuery = $j4;

There are three reasons why we need to store temporary variables first:

①. We do not want to change a large amount of jQuery plug-in source code. It is best not to change it. Even if we change it, we should change it as little as possible. It is also a good way to add modified code at the head and tail, leaving the original code in the middle unchanged.

②. Because 1.4.2 has given up control of jQuery and $, but the existing plug-in code uses them for reference, because plug-ins cannot predict conflicts, even if there are conflicts with plug-ins developed by others. Use $ or jQuery to reference, unless it is not a plug-in under jQuery.

③. In order to prevent the plug-in from directly using window.$ and window.jQuery to refer to 1.3.2 jQuery and $, although this situation is relatively rare, it is just in case.

The original code in the middle remains unchanged, and the following code is added at the end:

window.$ = _temp$;//将$的引用权限返还给jQuery1.3.
window.jQuery = _tempjQuery;//将jQuery的引用权限返还给jQuery1.3.

Step 3: If you want to use the selection function based on jQuery1.4.2 in the future, you can only use $j4(element).

Summary: The feasible solution so far: jQuery1.4.2 completely gives up the control permissions of $ and jQuery. 1.3.2 Give up the control rights of $ but not the rights of jQuery. In fact, jQuery can also be given up, but it must be given the alias $j3. It is best to place prototype behind jQuery1.3.2, which obtains the control permissions of $. It’s just that if you want to use jQuery1.4.2 in the future, you must use $j4 to reference it. But in this way, no matter how many jQuery framework version conflicts there are, they will all be solved. What if jQuery 1.2 comes, refer to the execution steps of (2), but the first step is changed to:

var $j2 = jQuery.noConflict(true);

Just use $j2(element) in the third step. The principles are the same.

I believe that what is described in this article has certain reference value for everyone’s jQuery programming.