Un sólo cambio para modificar múltiples páginas con JavaScript

El problema

En muchas ocasiones queremos realizar un determinado cambio en nuestra web que afecta a un gran número de páginas, una tarea que puede resultar bastante ardua si no contamos con herramientas adecuadas. Y aún contando con estas herramientas tras hacer los cambios debemos volcar todas las páginas modificadas a nuestro servidor. Un ejemplo típico se produce cuando queremos modificar una barra de navegación, barra que se muestra en todas las páginas de nuestra web: cuando queremos agregar una nueva opción nos encontramos con la necesidad de modificar un gran número de páginas

La solución

Podemos ahorrarnos trabajo de una forma muy simple: utilizar un archivo javascript enlazado en todas las páginas, este archivo contendrá el código para generar esa parte de nuestra página que podemos necesitar modificar en alguna ocasión. De esta forma para realizar un cambio en nuestras páginas bastará modificar el archivo javascript y sólo será necesario volcar este archivo modificado al servidor. En el ejemplo citado arriba el archivo enlazado contendría una función que generase la barra de navegación.

Un caso práctico

Como aplicación práctica seguimos con el ejemplo de la barra de navegación. En nuestro archivo js, al que llamaremos barranavegacion.js, colocamos un código que genere la barra de navegación, construida para este ejemplo mediante una sencilla tabla con cinco opciones

function dibujaBarra( )
{
document.write("<table><tr><td>opción1</td>");
document.write("<td>opción2</td>");
document.write("<td>opción3</td>");
document.write("<td>opción4</td>");
document.write("<td>opción5</td></tr></table>");
}

Dentro de nuestras páginas colocamos un elemento < script > que llame a esta función en el lugar de la sección body donde queremos que aparezca la barra de navegación:

<script language="Javascript">
dibujaBarra( )
</script>

Por supuesto en la sección HEAD de la página habremos colocado el script enlazado a nuestro archivo conteniendo la función dibujaBarra()

<script language="Javascript" src ="/barranavegacion.js"></script>

Es conveniente que para el argumento src utilices una dirección absoluta, para que sea accesible desde todas las páginas. En este ejemplo la barra invertida indica el directorio raiz del sitio web.

http://javascript.espaciolatino.com

Usuarios que han visto este tema también han visto...

- Mostrar fecha del sistema
- Detecta versiones de Flash con Javascript
- Cómo detectar la resolución de la pantalla en JavaScript
- Manejo de errores con JavaScript
- Confirmar acción con JavaScript

- Versión imprimible de este documento
- Enviar por e-mail este documento