2012-07-20 20 views
5

Deseo usar Head JS para cargar dinámicamente todos los otros scripts para mis páginas. Estoy planeando sobre el uso de la versión ofrecida por CDNJS para aprovechar mejor el almacenamiento en caché, disminución de la latencia, etc.Cómo cargar javascript desde un CDN con un respaldo local en el <head>

no tengo ninguna razón para pensar CDNJS va a ninguna parte, sino incluso para Google CDN alojado archivos como jQuery, me me gusta incluir una alternativa. Sin embargo, cuando estoy usando jQuery, los archivos se incluyen al final de la etiqueta <body>. Debido a la naturaleza de Head JS, necesito incluirlo en el <head> de mi página.

En el <body> me gustaría utilizar dos líneas de este tipo:

<script src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.96/head.min.js"></script> 
<script> window.head || document.write('<script src="js/libs/head-0.96.min.js"><\/script>') </script> 

¿Puedo utilizar este mismo conjunto de líneas en la cabeza como un mensaje? ¿No sobrescribirá document.write() toda la página? ¿Las secuencias de comandos no se cargan de manera diferente cuando existen en el <head> debido al orden en que los navegadores analizan el DOM?

Todavía soy bastante nuevo en esto, por lo que cualquier orientación sería de gran ayuda. ¡Gracias!

+1

document.write solo destruye su documento si intenta hacerlo DESPUÉS de que se haya completado la carga de la página. Un document.write en línea se ejecutará cuando la página se cargue/analice y simplemente inserte los datos escritos en el documento como está. –

+0

sí, pero ¿no cargará el Head JS las llamadas que están en el ' antes de que el script cargue desde un document.write? – stevenem

+0

solo si marcó la etiqueta del script anterior como 'async'. De lo contrario, los scripts se cargan de forma sincronizada. –

Respuesta

0

Como probablemente ya sepa, no estará probando window.jQuery, pero sí algunas funciones incluidas en head.js.

Además, tiene razón en que no puede usar document.write() dos veces aquí.

En lugar de document.write(), intente esto:

function appendScript(url) { 
    var head = document.getElementsByTagName('head')[0]; 
    var theScript = document.createElement('script'); 
    theScript.type = 'text/javascript'; 
    theScript.src = url; 
    theScript.onreadystatechange = callback; 
    theScript.onload = callback; 
    head.appendChild(theScript); 
} 

para la dirección URL, utilice su repliegue local.

+0

¡Gracias por señalar la parte jQuery! ¡Le daré una oportunidad a este! ¿Cómo configuro la devolución de llamada para ejecutar los comandos 'head.js()' después de cargar el Head JS? – stevenem

+0

No estoy seguro, no sé mucho sobre head.js, pero no sé si podría garantizar que esto se ejecute antes o después de head.js por diseño. –

Cuestiones relacionadas