Need to learn JavaScript? jQuery is a JavaScript framework, so if you don't already know about the JavaScript programming language, we recommend that you learn it now: Learn JavaScript

The community is working on translating this tutorial into Chinese, but it seems that no one has started the translation process for this article yet. If you can help us, then please click "More info".


Other frameworks and the noConflict() method

There may come a time when you wish to use other frameworks on your pages, while still using jQuery. For instance, a lot of third party JavaScript packages out there depends on one of the popular JavaScript frameworks, like ExtJS, MooTools and so on. Some of them uses the $ character as a shortcut, just like jQuery does, and suddenly you have two different frameworks trying to claim the same identifier, which might make your external scripts stop working. Fortunately the jQuery developers have already thought about situations like this and implemented the noConflict() method.

The noConflict() method simply releases the hold on the $ shortcut identifier, so that other scripts can use it. You can of course still use jQuery, simply by writing the full name instead of the shortcut. Here's a small example of it:

<div id="divTestArea1"></div>
<script type="text/javascript">
jQuery("#divTestArea1").text("jQuery is still here!");

If you think that "jQuery" is too much to type each time, you can create your own shortcut very easily. The noConflict() method returns a reference to jQuery, that you can save in your own little variable, for later use. Here's how it looks:

<div id="divTestArea2"></div>
<script type="text/javascript">
var jQ = $.noConflict();
jQ("#divTestArea2").text("jQuery is still here!");

If you have a block of jQuery code which uses the $ shortcut and you don't feel like changing it all, you can use the following construct. It's yet another version of the ready method, where $ is passed in as a parameter. This allows you to access jQuery using $, but only inside of this function - outside of it, other frameworks will have access to $ and you will have to use "jQuery":

<div id="divTestArea3"></div>
<script type="text/javascript">
	$("#divTestArea3").text("jQuery is still here!");