2010-04-29 6 views
2

J'utilise un système assez simple pour charger javascript dynamiquement:Impossible d'accéder à des variables de javascript dynamiquement chargé

include = function (url) { 
    var e = document.createElement("script"); 
    e.src = url; 
    e.type="text/javascript"; 
    document.getElementsByTagName("head")[0].appendChild(e); 
}; 

Disons que j'ai un test.js de fichier qui a le contenu suivant:

var foo = 4; 

maintenant, dans mon script original, je veux utiliser

include(test.js); 
console.log(foo); 

Cependant, je reçois un 'foo n'a pas été défini' Erro r sur cela. Je suppose que cela a à voir avec le script dynamique étant inclus en tant que dernier enfant de la balise <head>. Comment puis-je faire en sorte que cela fonctionne?

Répondre

3

Il s'agit d'un problème, mais le navigateur a également besoin de temps pour télécharger et analyser le fichier JS distant, ce qu'il n'a pas fait avant d'appeler console.log.

Vous devez retarder les opérations jusqu'à ce que le script soit chargé.

Cela est plus facile en laissant une bibliothèque faire le gros du travail, jQuery a une méthode getScript qui vous permet de passer un callback à exécuter quand le script a été chargé.

5

C'est parce que vous devez attendre le chargement du script. Ce n'est pas synchrone comme on pourrait le penser. Cela peut fonctionner pour vous:

include = function (url, fn) { 
    var e = document.createElement("script"); 
    e.onload = fn; 
    e.src = url; 
    e.async=true; 
    document.getElementsByTagName("head")[0].appendChild(e); 
}; 

include("test.js",function(){ 
    console.log(foo); 
}); 
+0

Nice script simple. Mais comment pouvons-nous intégrer les événements d'échec (comme la connexion non établie, ou 404 etc) dans ce .. – user1517108

Questions connexes