Several of my pages use both JQuery and Protoype. Since I upgraded to version 1.3 of JQuery this appears to be causing problems, because both libraries define a function nam
Just as a note to others that stumble upon this. The solutions are described here (mentioning prototype specifically): http://docs.jquery.com/Using_jQuery_with_Other_Libraries
Could you not just include the jQuery = noConflict()
code in the jquery.js source file? Why would it need to be defined that way?
I went through this for a while. It is very annoying and in the end I decided to weed out all of my old Prototype stuff and replace it with jQuery. I do like the way Prototype handles some Ajax tasks but it wasn't worth the trade off of maintaining all of the no conflict stuff.
If I were you, I'd drop my no conflict code into a JavaScript include file like you opined about above, and then figure out some process where I'd be setting these things I need to include in all my pages in one central place. If you are working with straight HTML files and you don't have any kind of templating/scripting capability server-side for what gets included in a document, there's always the possibility of doing a Server-Side Include.
Either way, the pain you'll experience updating each of your pages this time will come back again when you need to update your analytics code or the site footer.
Your jquery-noconflict.js
should look like this (be sure that all is in one line):
document.write("<script type=\"text/javascript\" src=\"/obp/js/jquery.js\"></script><script type=\"text/javascript\">jQuery.noConflict();var $j = jQuery;</script>");
... and than your include (as you already pointed out) should look like this:
<head>
<script type="text/javascript" src="/obp/js/prototype.js"></script>
<script type="text/javascript" src="/obp/js/jquery-noconflict.js"></script>
</head>
This solution solves all your requirements I think.
<script>
document.write(unescape('%3Cscript type="text/javascript" src="/obp/js/jquery.js"%3E%3C/script%3E'));
</script>
<script>
jQuery.noConflict();
var $j = jQuery;
</script>
or
var scripty = document.createElement('script');
scripty.href="/obp/js/jquery.js";
document.getElementsByTagName('head')[0].appendChild(scripty);
jQuery.noConflict();
var $j = jQuery;
EDIT:
I tried out this suggestion but the last 2 lines produce the error
jQuery is not defined