sonic: Problem beim dynamischen Nachladen von JS in Webkit-Browsern

Beitrag lesen

Hi!

Ich versuche im Moment, in einer JS-Datei weitere JS-Dateien nachzuladen, falls die nicht bereits vorhanden sind, im Speziellen probiere ich, jQuery nachzuladen und zwar mit folgendem Code:

  
if (typeof $ == 'undefined')  
{  
    try  
    {  
	var script_tag = document.createElement('script');  
	script_tag.setAttribute('type', 'text/javascript');  
	script_tag.setAttribute('src', "jquery-1.4.2.min.js");  
  
        // Callback for FF, Chrome, Safari, Opera  
        if (typeof(script_tag.addEventListener) != 'undefined')  
        {  
            script_tag.addEventListener('load', startup, false);  
        }  
        else  
        {  
            // Callback IE  
            var loadFunction = function()  
            {  
	        if (this.readyState == 'complete' || this.readyState == 'loaded')  
	        {  
	            startup();  
	        }  
            };  
            script_tag.onreadystatechange = loadFunction;  
        }  
  
	var head = document.getElementsByTagName("head")[0];  
	head.appendChild(script_tag);  
    }  
    catch(e)  
    {  
	document.write('<script type="text/javascript" src="jquery-1.4.2.min.js"></script>');  
        startup();  
    }  
  
}  
else  
{  
    startup();  
}  

Das Ganze funktioniert in Opera, FF und IE6 auch erstaunlich gut (in der startup-funktion wird dann ein jquery-Plugin geladen), bloß bei Chrome und Safari habe ich das Problem, dass ich auf meiner eigentlichen HTML-Seite immer folgenden Fehler bekomme:

Uncaught ReferenceError: $ is not defined

Das HTML sieht grob gesagt so aus:

  
<html>  
<head>  
<script type="text/javascript" src="loader.js"></script>  
<title>Test</title>  
</head>  
<body>  
  
<h1 id="test">TEST HEADING</h1>  
  
<script type="text/javascript">  
$('h1').css('color', 'red');  
</script>  
  
</body>  
</html>  

Meine Theorie ist, dass Chrome/Safari das inline-JS auf der Seite schon evaluieren, bevor die neue Datei fertig geladen ist, aber ich wüsste nicht, wie ich den Browser davon abhalten kann.

Falls jemand hierzu eine Idee hat, gebt bitte einfach bescheid, freue mich über jeden kreativen Vorschlag! (den grundsätzlichen Aufbau kann ich allerdings nicht ändern, d.h. das inline-JS in einen Callback zu packen o.ä. wird nicht funktionieren)