<!DOCTYPE html>
<html>
<head>
</head>
<body>
Contenido de la pagina
</body>
<script>
/**
* Funcion que carga el archivo JS o CSS utilizando XMLHttpRequest
* Tiene que recibir:
* la url del archivo js o css
* la funcion a llamar cuando se haya cargado el contenido
*/
function getContent(url, callBackFunction)
{
try
{
// creamos el objeto XMLHttpRequest
var asyncRequest = new XMLHttpRequest();
// registramos cualquier evento
asyncRequest.onreadystatechange = function()
{
// Si develve "Done" (4) o ok (200)
if (asyncRequest.readyState==4 && asyncRequest.status==200)
{
// mamamos a la funcion pasada por parametro enviando el contenido
// del archivo descargado
callBackFunction(asyncRequest.responseText);
}
}
// Preparamos la peticion
asyncRequest.open('GET', url, true);
// enviamos la petición
asyncRequest.send(null);
}
catch(exception)
{
alert('Fallo en la peticion');
}
}
// Llamamos a la funcion getContent pasando como parametro el archivo JS a
// abrir y la funcion que tiene que ejecutar una vez se haya cargado el archivo
getContent("/js/miArchivo.js",function (code) {
// Creamos un nuevo elemento <script>
var s = document.createElement('script');
// añadimos dentro del <script> el contenido descargado
s.innerHTML=code;
// Lo añadimos encima del primer <script> de la pagina
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
/** EN ESTE PUNTO EL ARCHIVO YA SE HA CARGADO, Y PODEMOS GESTIONAR CUALQUIER
EVENTO O FUNCION **/
});
// Llamamos a la funcion getContent pasando como parametro el archivo CSS a
// abrir y la funcion que tiene que ejecutar una vez se haya cargado el archivo
getContent("/css/miArchivo.css",function (code) {
// Creamos un nuevo elemento <style>
var s = document.createElement('style');
// añadimos dentro del <style> el contenido descargado
s.innerHTML=code;
// Lo añadimos encima del primer <script> de la pagina
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
/** EN ESTE PUNTO EL ARCHIVO YA SE HA CARGADO, Y PODEMOS GESTIONAR CUALQUIER
EVENTO O FUNCION **/
});
</script>
</html>
Comentarios sobre la versión: Versión 1.0 (2)