Solutions to conflicts between jQuery and other libraries_jquery

(Note: By default, jQuery uses $ as its abbreviation)
If the jQuery class library conflicts with other class libraries, you can use the jQuerynoConflict() function to transfer control of the variable $ to other libraries. javaScipt library. Look at the small snippet of code below


Suppose there is such a function in the JsCOM.js library

Copy code The code is as follows:

function $(objName) {
if (document.getElementById) {
return eval(' document.getElementById("' objName '")')
}
else {
return eval("document.all." objName)
}

Everyone Knowing that there is such a function in jQuery, in order not to cause conflicts, we transfer control of jQuery’s variable $ to other javascript libraries

Copy code The code is as follows:

jQuery.noConflict(); //Transfer control of variable $ to JsCOM.js
var $cr = jQuery("#cr" ); //Still using the jQuery class library, just replacing the original $ with jQuery.
var JsCOM_cr = $("cr"); //Use the JsCOM.js class library

Here you can use the jQuery() function as a manufacturing factory for jQuery objects.
A few points to note here
1. When referencing the javascript class library, be sure to put the jQuery reference at the end, just like above, the reference to JsCOM.js is in front of the jQuery reference ( I don’t know the specific reason, but it is indeed necessary)
2. Pay special attention to when jQuery() replaces $(). jQuery is case-sensitive, because javascript itself is case-sensitive (it seems a bit redundant, But I still hope you won’t make this mistake)
Basically, you can solve the conflict between jQuery and other libraries according to the above method!
If you feel uncomfortable with the above method, having to type jQuery instead of $ every time increases your keyboarding workload, then please continue reading. .
Besides the above, there is another option. If you want to ensure that jQuery will not conflict with other libraries, but want to customize a shortcut, you can do the following;

Copy code The code is as follows:

var $j = jQuery.noConflict(); //Customize a shortcut
var $cr = $j("#cr"); //Use jQuery Class library, you have to use a custom shortcut ----$j;
var JsCOM_cr = $("cr"); //Same as the previous code, using the JsCOM.js class library

If you have other requirements and want to continue using the original $() without conflicting with other class libraries, there are two solutions
One:

Copy code The code is as follows:

jQuery.noConflict(); //Give control of variable $ to JsCOM .js
jQuery(function($)
{
$("p").click(function() //You can use the $() method of the jquery class library to continue within the function
{
alert($(this).text());
})
})
var JsCOM_cr = $("cr"); // Outside the function, you can still use JsCOM.js The $() method

Second:

Copy code The code is as follows:

jQuery.noConflict(); //Transfer the control of variable $ to other class libraries. When using the $ symbol of jquery class library, please use jQuery("#id");
(function ($) { //Define the anonymous function and set the formal parameters to $
$(function() { //The $ inside the anonymous function are all jQuery
$("div").click(function() { //Continue to use the $() method
alert($(this).text());
})
})
})
(jQuery); //Use anonymous function And pass the actual parameter jQUery
alert($("cr")); //Using the $() function in the jsCOM.js class library

The second method should be the best way to be compatible with the old code, and the code modifications are the least!
But if it is a new jQuery code, I still prefer to use the one I talked about at the beginning (jQuery.noConflict(), and then use jQuery("#id"), this method)
If your page first references the jQuery class library and then introduces other class libraries, then we can use jQuery directly to do some work. At the same time, we can use the $() method as a shortcut to other libraries. There is no need to call the jQuery.noConflict() function here, please see the following code

Copy the code The code is as follows:

jQuery().ready(function() { //No need to call jQuery.noConflict() function
var $cr = jQuery ("#cr");
$cr.click(function() {
if ($cr.is(":checked")) {
alert("Thank you for your support! You can continue Operated..");
}
})
})
alert($("cr")); //Using the $() function in the jsCOM.js class library

Okay, after reading the above methods to resolve conflicts, you can safely reference jQuery in your project:)