Javatpoint Logo
Javatpoint Logo

jQuery noConflict() method

The $ (dollar) sign in jQuery is used as an alias or shortcut. Many JavaScript libraries also use the $ sign as the shortcut, along with the jQuery on the same page. But if two different frameworks use the same alias, a conflict could occur, and one of the frameworks might stop its working.

The noConflict() method implemented in jQuery to deal with such situations. It is used to avoid the conflict of using $ variable with other libraries. This method releases the hold on the $ (dollar) identifier so that other libraries can use it.

This method can also be used to create a new shortcut. This means we can use this method to create a custom alias name. If we don't want to define another shortcut, or if we like to use $ sign as it saves times and easy to use, then we can use a new approach; that is, we can pass the $ as an argument to the $(document).ready() function. It can be written as -

Syntax

The commonly used syntax of this method is given as follows.

It does not accept any argument.

Let's see some illustrations to understand how to use the noConflict().

Example1

In this example, we are using two JS libraries that are prototype and jQuery. Both of these libraries use $ as an alias, so we are using the noConflict() method to avoid conflict. The noConflict() method allows jQuery to release its hold over the $ identifier and make it available for other libraries. Here, another library is prototype.

When the document is loaded, jQuery goes into noConflict mode. Here, we are creating a new alias using the jQuery noConflict(). We are declaring a variable named as j and assigning the noConflict() method to it. Now, this variable will work as an alias for the jQuery code. This new alias will be used instead of using $. So, it avoids conflict with the prototype library.

We have to click the given button to see the effect.

Test it Now

Output:

After the execution of the above code, the output will be -

jQuery noConflict() method

After clicking the given Run jQuery button, the output will be -

jQuery noConflict() method

After clicking the given Run Prototype button, the output will be -

jQuery noConflict() method

Suppose we have a piece of jQuery code in which we used $ shortcut, and we don't want to modify the code, or we like to use the $ because it is easy to use so we can use the approach given in the next example.

Example2

Here, we are simply passing the $ sign as the argument of the $(document).ready() function. This allows us to access jQuery using $ within the function. But outside the function, we have to use the full name jQuery.

The output is the same as the above example.

Test it Now

Output:

After the execution of the above code, the output will be -

jQuery noConflict() method

After clicking the given Run jQuery button, the output will be -

jQuery noConflict() method

After clicking the given Run Prototype button, the output will be -

jQuery noConflict() method




Youtube For Videos Join Our Youtube Channel: Join Now

Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA