Objet non défini ... charger dynamiquement des scripts et créer des objets qui y sont définis génère une erreur

Question

Je charge des scripts renvoyés par le serveur ... certains ont des objets définis en eux ... en ajoutant les scripts au corps et en essayant pour créer un nouvel objet et compte tenu des scripts objet donc des définitions chargées dans la page ... ce qui est pas le cas car cela est objet jeter pas trouvé d'erreur ... voici comment le code ressemble ...

for(var i=0; i < paths; i++){ 
    var script = document.createElement('script'); 
    script.type='text/javascript'; 
    script.src=paths[i].src; 
    document.body.appendChild(script); 
} 
var new_obj = new object_name(a, b, c); // object_name not found 

Je peux voir que le script a été ajouté avec succès au corps dans l'onglet des éléments.

J'ai essayé de charger le script à la fin du corps de la page manuellement et son travail de cette façon, mais pas quand j'ajouter le fichier dynamiquement ... S'il vous plaît me dire ce qui se passe mal ....

Answer 1

Vous pouvez définir la propriété async sur false (pour charger les scripts de manière synchrone dans l'ordre) et implémenter l'événement onload pour vérifier si le script est chargé. Le code ci-dessous montre l'implémentation. Je peux me tromper dans l'implémentation ou il pourrait y avoir un meilleur moyen de charger des scripts basés sur array (looping) et de vérifier tous les fichiers chargés.

<script> 
     window.onload = function() { LoadFunctions(); } 
     var paths = ["test.js", "test2.js"]; 

     function LoadFunctions() { 
      for(var i=0; i < paths.length; i++){ 
       var script = document.createElement('script'); 
       script.type='text/javascript'; 
       script.src=paths[i]; 
       script.async = false; 
       script.onload = function() { callFunctions(); } 
       document.head.appendChild(script); 
      } 
     } 

     function callFunctions(){ 
      if (typeof test1 != "undefined") test1(); //Check for function in test.js whether loaded or not then execute it 
      if (typeof test2 != "undefined") test2(); //Check for function in test2.js whether loaded or not then execute it 
     } 
</script> 

test.js

function test1(){ 
    alert("Alert from test.js"); 
} 

test2.js

function test2(){ 
    alert("Alert from test2.js"); 
}