[jQuery] Loading dynamic JS libraries with jQuery
Hi,
I'm trying to load JS files (libraries) dynamically at run-time with
jQuery but I'm not being able to... I thought I had this working
before but now it's not. Here's my code:
INDEX.HTML
<html>
<head>
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/global.js"></script>
</head>
<body>
</body>
</html>
GLOBAL.JS
function loadJavascript(scriptFile) {
var scriptsPath;
// Builds the correct scripts path
scriptsPath = $('script').attr('src');
scriptsPath = scriptsPath.replace(/\w+\.js$/, '');
// Creates the <script> element and appends it to the <head>
$(document.createElement('script'))
.attr('src', scriptsPath + scriptFile + ".js")
.attr('type', 'text/javascript')
.appendTo('head');
}
$(document).ready(function() {
// Dynamically loads a list of javascript files
loadJavascript('jquery.form');
}
It should have created a <script> element like this:
<script type="text/javascript" src="scripts/jquery.form.js"></script>
And appended it to the <head> element, but it didn't work...
I'm using the latest jQuery v1.2.2. Hope someone can clarify this to
me... Why can't I do this?