Ejecutar jQuery después de que todos los demás JS hayan ejecutado

Question

En el pasado, he usado $ (window) .onload para ejecutar un bloque de código después de que se hayan cargado otros scripts. En este caso, no tengo la capacidad de cambiar el orden de carga de los archivos JS y el código que me interesa necesita manipular los nodos DOM que se insertan dinámicamente por otro archivo JS que se carga más abajo en la página. Ambos scripts se encuentran cerca de la parte inferior del documento. ¿Alguien tiene alguna sugerencia para este escenario?

Answer 1

Si la otra secuencia de comandos se ejecuta completamente en un evento de carga, puede agregar un controlador al mismo evento y poner su código en una llamada setTimeout (con un retraso de 1), lo que obligará a su código a ejecutarse durante la próxima descanso.

Answer 2

Si sabe qué elementos esperar, puede usar setInterval para sondear el DOM para ver cuándo se insertaron. Por ejemplo, se trata de cómo se puede sondear para un elemento con ID foo:

$(window).load(function() 
{ 
    var i = setInterval(function() 
    { 
     if ($('#foo').length) 
     { 
      clearInterval(i); 
      // safe to execute your code here 
     } 
    }, 100); 
}); 

Answer 3

A pesar de que no se puede cambiar el orden de carga, se puede cambiar la forma en que se carga?

Una cosa que he utilizado en el pasado cuando quería cargar algunos javascript y ejecutar algún código después yo estaba seguro de que había terminado de cargar es de jQuery $ .getScript:

$.getScript('javascripttoload.js', function() { 
     //do the DOM manipulation you were talking about... 
}); 

http://api.jquery.com/jQuery.getScript/

Answer 4

Si necesita adjuntar un controlador de eventos a futuros nodos DOM, puede usar jQuery .live(); de lo contrario, puede usar el complemento livequery.

ejemplo:

$(".nodes").livequery(function() { 
    // do something with the nodes 
} 

que se llame a la función anónima suministrado para todos los nodos actuales y futuras con la clase .nodes

Answer 5

El problema estaba tratando de declarar una variable para almacenar el objeto jQuery antes del objeto estaba en la página. Mover esas declaraciones dentro de un bloque de código que solo se ejecutó después de un evento de clic que solo se enlazó después de $ (ventana) .load resolvió el problema.

¡Gracias a todos por los consejos, sin embargo!