Question

I’m working on a Javascript library which is currently in use by our websites (> 8000).
Websites are calling a bootstrapper js that on it’s turn will reference some other library scripts.

Since our JavaScript library heavily uses jQuery, it’s currently included in the bootstrapper as well.

This is done using document.writeln:

document.writeln("<script src=\"js\/jquery-1.4.4.min.js\" type=\"text\/javascript\"><\/script>");

I’m aware that document.writeln isn’t xHtml compliant and there are much better solutions, but this is just the way it currently works fine for all our websites and getting rid of document.writeln is not an option.

The problem now is that we get conflicts when a site already defines a lower version of jQuery. So, we decided redefine jQuery in our library:

document.writeln("<script src=\"js\/jquery-1.4.4.min.js\" type=\"text\/javascript\"><\/script>");
document.writeln("<script type=\"text\/javascript\">");    
document.writeln("   var $myJQuery = jQuery.noConflict();");
document.writeln("</script>");

Unfortunately, it doesn’t work.

Does anybody have a solution?

Answer 1

The jQuery.noConflict() only frees the $() and not jQuery() and maybe that’s the problem. You could try doing it manually (but see below for a better way) like this:

<script>
  theOld$ = $;
  theOldjQuery = jQuery;
</script>
<script src=jquery-new-version.js></script>
<script>
  $ = theOld$;
  newjQuery = jQuery;
  jQuery = theOldjQuery;
</script>

UPDATE: A better way to do the same (thanks to T.J. Crowder for the tip) would be:

<script src=jquery-new-version.js></script>
<script>
  newjQuery = jQuery.noConflict(true);
</script>

See the docs for jQuery.noConflict.