Como incluir JavaScript en una página web.

Existen dos maneras de incluir código JavaScript en una página HTML:

• Inclusión directa
• Desde un archivo externo

Cave aclarar que los dos métodos son válidos para cualquier página HTML, pero ambos presentan ventajas entre ellos según el uso del código JavaScript empleado.

Inclusión directa

La inclusión de código de forma directa implica escribir el código JavaScript dentro del archivo HTML que conforma la página. Est lo hacemos mediante la etiqueta SCRIPT. Vemos el código necesario para esto:

<script language="javascript">
	// Acá va todo el código JavaScript
</script>

Vemos que tiene el mismo formato que una etiqueta HTML, con los símbolos < > y la posibilidad de asignar atributos tales como el lenguaje utilizado en el código. Esto es muy importante que nos acostumbremos a definir mediante el atributo languaje el tipo de código utilizado, es este caso javascript.

Este método se recomienda utilizar solo para códigos pequeños, es decir que no tengan más de 50 líneas de código y si tenemos 1 solo script por página. De otra manera es recomendable utilizar un archivo externo para cada script.

Desde un archivo externo

El segundo método es muy utilizado cuando disponemos de un código muy extenso (de muchas líneas), cuando el mismo JavaScript lo utilicemos en varias páginas o cuando tengamos varios Script y cada uno de ellos queramos "organizarlos" en un archivo diferente.

La forma de incluir código JavaScript desde un archivo externo sería:

<script language="javascript" src="archivo.js"></script>

Vemos que se utilizó la misma etiqueta SCRIPT y en este caso se agregó el atributo src para llamar al archivo externo que deberá tener siempre la extensión .js (archivo javascript).

Una de las ventajas de este método es que al estar el código en un archivo separado al archivo HTML de la página, el navegador descargará una sola vez el archivo y luego lo leerá desde la cache, permitiendo así un menor tráfico de información en cada petición nueva y una mayor velocidad de descarga.
Y la gran ventaja es que si tenemos varias páginas HTML que utilicen el mismo código JavaScript, tendremos que editar solo un archivo (el archivo js asociado) para reflejar los cambios en todos los archivos restantes.

Aclaro que es posible y perfectamente válido utilizar los dos métodos en conjunto, es decir podremos incluir código JavaScript de manera directa y a través de un archivo externo en un documento HTML sin ningún problema.

A continuación dejo un ejemplo que muestra el uso de los dos métodos.