miércoles, 26 de febrero de 2014

Include con Javascript


Bienvenid@s, hoy vamos a emular en cierto modo la función que puede realizar "include" en PHP, que permite agregar código de un archivo externo en el interior del script donde es llamado. Con Javascript no existe una función específica para realizar esta tarea aunque como veremos a continuación también es posible siguiendo unos sencillos pasos.

Lo primero que vamos a hacer, es crear un documento 'index.html' desde el cual veremos la prueba de ejecución js de los distintos archivos que vamos a incluir ...


<!doctype html>
<html>
<head>
<title>Include Javascript</title>
<script type='text/javascript' src='include.js'></script>
</head>
<body>

</body>
</html>


Bien como podemos ver, se está incluyendo un archivo javascript llamado 'include.js', a través de este archivo vamos a cargar los scripts que necesitemos, así que ahora vamos a crear un nuevo archivo al que llamaremos 'include.js' y crearemos la función para poder realizar la inclusión de código de archivos js externos ...

function include(_src)
{
head = document.getElementsByTagName('head')[0];
script = document.createElement("script");
script.type = "text/javascript";
script.src = _src;
head.appendChild(script);
}

include('index-1.js');
include('index-2.js');


 Ok, podemos ver que estamos incluyendo dos archivos javascript 'index-1.js' e 'index-2.js' ahora crearemos ambos archivos, que para el ejemplo bastará con mostrar una alerta por cada archivo js ...

index-1.js ...

alert('Ejecutando código de index-1.js');


index-2.js ...

alert('Ejecutando código de index-2.js');


Ahora ejecuta index.html en el navegador y verás ambas alertas.