When using other JavaScript frameworks on your site along with jQuery, there is the potential for a conflict to happen, where multiple frameworks try to run the same block of code.
The following shows a typical line of jQuery. What makes the browser realize it’s dealing with something that is NOT plain JavaScript, is the $. This tells the browser to use jQuery.
$('p').hide()
However, there are other JavaScript frameworks/libraries that use the $, and if you are using multiple libraries that do so, there may (probably will) be a conflict.
Writing Out jQuery Instead of Using $
One way to overcome any conflicts with other libraries is to write out jQuery instead of using the $ sign.
jQuery('p').hide()
Here’s what it looks like in a typical block of jQuery code. This will avoid any conflicts.
jQuery(document).ready(function() {
jQuery('button').click(function() {
jQuery('p').hide();
});
});
The noConflict() Method
Another (maybe better) way to avoid the conflict is to use the noConflict() method built into jQuery to assign a different string to notify the browser that jQuery is being used. In the following, “jq” is assigned to represent the default $ sign.
var jq = $.noConflict();
jq(document).ready(function() {
jq('button').click(function() {
jq('p').hide();
});
});
var xx = $.noConflict(); var Pete = $.noConflict(); var whatever = $.noConflict();
With all this said, it is unlikely that you’ll have a conflict and need to use anything other than the default $ sign. Most often, you don’t use numerous JavaScript frameworks, as that would be unnecessary and would contain a lot of redundant methods. Plus, it slows down the site.
We’d like to acknowledge that we learned a great deal of our coding from W3Schools and TutorialsPoint, borrowing heavily from their teaching process and excellent code examples. We highly recommend both sites to deepen your experience, and further your coding journey. We’re just hitting the basics here at 1SMARTchicken.
Why 1SMARTchicken?
See More →
Thanks for your support!
jQuery Books
All are affiliate links. Thank you for your support!
jQUERY NOTES:
- To use jQuery on your site, it must first be downloaded from the official jQuery site and linked to in your document
head, or linked to via a CDN in your documenthead - It is generally good practice to place your jQuery code/function inside the document load function so that the action takes place ONLY after the document has finished loading
- When using jQuery, single or double quotation marks are acceptable and work identically to one another; choose whichever you prefer, and stay consistent
Feedback
If you see an error on the page or the code itself is incorrect or incomplete, or just plain wrong, please let us know. We’re always learning. NOTE: we do not sell your information and will not send you spam emails.
