jQuery noConflict() With Examples

jQuery noConflict() method releases the control of the $ variable. You might have seen many JavaScript libraries which uses $ variable. In jQuery $ is used as an alias for jQuery. If you want to use the $ variable of other libraries, jQuery have to release the control over the $ variable by calling it’s noconflict method.

jQuery noConflict

Here is the general syntax for using the jQuery noConflict method:

jQuery noConflict example

Following examples demonstrate the use of jQuery noConflict method.

In the above example fade and toggle effect applied to <div> element.

You will not get the desired output because it uses $.noConflict() method above the $(document).ready() function. If you remove the $.noConflict() method, the above code will give you the appropriate result.

In the example below, you can see that $.noconflict() is used and the full name jQuery is used instead of $ variable in ready function and all other methods. This code will work even though the noConflict() method is used.

jQuery noConflict alias

In the below example you can see that $.noConflict() method is used with a custom alias name ‘jq‘. This code will also give you the proper output.

jQuery uses noConflict() method to avoid the conflict of using $ variable with other JavaScript variables. The above examples will give you an idea about the usage of noConflict method in jQuery.

Reference: API Doc

By admin

Leave a Reply