Cargando scripts dinámicamente

Estoy cargando algunos scripts YUI dinámicamente en mi código en respuesta a una solicitud Ajax. El DOM y la página están completamente cargados cuando se realiza la solicitud: es una respuesta para un evento de usuario.Cargando scripts dinámicamente

Agrego la etiqueta a la cabeza, cuando era niño. Pero tropecé con algunos problemas:

Agrego dos scripts YUI alojados en Yahoo! CDN y una secuencia de comandos en línea de mi propia responsabilidad para crear objetos, agregar oyentes de eventos y renderizar los widgets de YUI. Pero cuando ejecuto el script, los scripts YUI no están cargados, pero me dan errores y no funcionan como esperaba.

¿Hay una forma de ejecutar solo mi script (o definir una función para ejecutar) cuando los scripts YUI están cargados por completo?

Fuente

2010-06-26 Vitor Py

Se puede usar un setTimeout() ejecutar alguna función que simplemente comprueba si se ha cargado - comprobar algo así como

if (typeof YUI_NAMESPACED_THING !== "undefined") runCode()

EDITAR Gracias, CMS

Fuente

2010-06-27 00:04:08

El 'typeof' operador * * siempre devuelve una cadena, el cheque debe ser' si (typeof YUI_NAMESPACED_THING! = "Indefinido") // ... ' – CMS

Este es el mal manera de hacerlo. En primer lugar, probablemente esté pensando en setInterval o un setTimeout encadenado, ya que un solo setTimeout podría A) retrasar la ejecución demasiado tiempo ocasionando un tiempo de configuración de la página innecesariamente malo, o B) fallar la condición de carrera creada suponiendo que los scripts se cargarían dentro de un tiempo específico. Algo basado en la solución onload/onreadystatechange es mejor. – Luke

@Luke Estaba pensando en el setTimeout encadenado. Pero sí, estoy de acuerdo en que onload/onreadystatechange es una mejor solución. Sabía que la carga no funcionaba por sí sola y no sabía que había una solución de navegador cruzado en ese callejón. Volví a subir la respuesta de digitalFresh –

¿Usted ha intentado un proceso de carga?

Editado: (gracias Jamie)

var script = document.createElement("script"); 
script.type = "text/javascript"; 
script.src = src; 
//IE: 
if(window.attachEvent && document.all) { 
    script.onreadystatechange = function() { 
     if(this.readyState === "complete") { 
      callback_function(); //execute 
     } 
    }; 
} 
//other browsers: 
else { 
    script.onload = callback_function; //execute 
} 
document.getElementsByTagName("head")[0].appendChild(script);

Fuente

2010-06-27 00:06:25 tcooc

Si bien esto puede funcionar en algunos navegadores, los elementos 'script' no requieren tener un controlador de eventos onLoad, por lo que sé - http://www.w3schools.com/tags/tag_script.asp –

Todos los navegadores excepto IE tienen un evento 'onload' (algo predecible). En IE, necesita una función de retorno 'onreadystatechange'. – tcooc

+1 - No había oído hablar de 'onreadystatechange'. Bueno saber –

Si está utilizando 2.x YUI le recomiendo el uso de la utilidad YUI Get, ya que está diseñado para manejar sólo esta clase de problema.

Fuente

2010-06-27 06:14:00 Tivac

Si está cargando varios archivos de script individuales de Yahoo! CDN, necesitarás asegurarte de que ambos estén cargados antes de ejecutar tu código dependiente. Puede evitar esto usando el controlador combinado. Consulte el Configurador para obtener la url de la secuencia de comandos para cargar ambos/todos los archivos YUI necesarios desde una url.

http://developer.yahoo.com/yui/articles/hosting/

Con esto en mente, suponiendo que debe cargar los archivos de forma asíncrona YUI, usted debe utilizar un/manejador onload onreadystatechange como señaló digitalFresh.

Yo recomendaría el siguiente patrón, sin embargo:

(function (d) { 
    var s = d.createElement('script'), 
     onEvent = ('onreadystatechange' in s) ? 'onreadystatechange' : 'onload'; 

    s[onEvent] = function() { 
     if (("loaded,complete").indexOf(this.readyState || "loaded") > -1) { 
      s[onEvent] = null; 

      // Call your code here 
      YAHOO.util.Dom.get('x').innerHTML = "Loaded"; 
     } 
    }; 

    // Set the src to the combo script url, e.g. 
    s.src = "http://yui.yahooapis.com/combo?2.8.1/..."; 

    d.getElementsByTagName('head')[0].appendChild(s); 
})(document);

Fuente

2010-06-27 06:59:42 Luke

Si entiendo esto correctamente, su respuesta Ajax con esto:

<script href="yui-combo?1"></script> 
<script href="yui-combo?2"></script> 
<p>some text here</a> 
<script> 
// using some of the components included in the previous combos 
// YAHOO.whatever here... 
</script>

Si este es el caso, se trata de un caso claro en el cual deberías usar el plugin dispatcher. Dispatcher emulará el proceso de carga del navegador para respuestas AJAX. Básicamente cargará y ejecutará cada script en el orden exacto.

Best Regards, Caridy

Fuente

2010-06-27 15:06:39

Respuesta

Cuestiones relacionadas