¿Cómo ejecutar una función de javascript después de que se cargó un JS específico?

Question

He hecho una función js para incluir otro javascript en mi html. Necesito asegurarme de que el script que he cargado usando la función haya completado el procesamiento y luego solo avance más en mi script original.

function loadBackupScript(){ 
    var script = document.createElement('script'); 
    script.src = 'http://www.geoplugin.net/javascript.gp'; 
    script.type = 'text/javascript'; 
    var head = document.getElementsByTagName("head")[0]; 
    head.appendChild(script); 
} 

Necesito saber que la secuencia de comandos se ha cargado para usar sus funciones en el futuro. ¿Cómo puedo hacer eso?

Answer 1

function loadBackupScript(callback) { 
    var script; 
    if (typeof callback !== 'function') { 
     throw new Error('Not a valid callback'); 
    } 
    script = document.createElement('script'); 
    script.onload = callback; 
    script.src = 'http://www.geoplugin.net/javascript.gp'; 
    document.head.appendChild(script); 
} 

loadBackupScript(function() { alert('loaded'); }); 

Answer 2

Agregue esto a su función:

// all cool browsers 
script.onload = doSomething; 
// IE 6 & 7 
script.onreadystatechange = function() { 
if (this.readyState == 'complete') { 
    doSomething(); 
} 

SI usted no confía en estos eventos también se puede utilizar setTimeout() para comprobar la existencia de la función. Un buen artículo sobre esto se puede encontrar aquí:

http://www.ejeliot.com/blog/109

Answer 3

yo recomendaría usar LABJs para esto.

Su uso se puede hacer esto

$LAB 
.script("framework.js") 
.wait(function(){ 
    //called when framework.js is loaded 
}) 
.script("init.js") 
.wait(function(){ 
    //called when init.js is loaded 
}); 

Ésta es multi-navegador y, a menudo ser más eficiente que hardcoding etiquetas script en tu HTML debido a la forma en que se apoya descargas paralelas.

Puede leer más sobre esto here