Integración de código Javascript en páginas web.
Esisten varias formas de integrar el código Javascript en una página web:
1ª. Código Javascript entre etiquetas <script></script> en una parte de la página.
1 2 3 4 5 6 7 8 9 10 11 12 13 | <!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8" /> <title>Código JavaScript en la propia página utilizando etiqueta script.</title> <script type="text/javascript> alert("Esto es un mensaje cualquiera"); </script> </head> <body> <p>Un párrafo cualquiera.</p> </body> </html> |
El bloque <script> puede situarse en cualquier zona de la página, aunque lo recomendable es situarlo en la cabecera del documento.
2ª. Utilizando un archivo de código javascript exterior.
1 2 3 4 5 6 7 8 9 10 11 | !DOCTYPE html <html lang="es"> <head> <meta charset="utf-8" /> <title>aplicando archivo exterior al documento.</title> <script type="text/javascript src="archivo-externo.js"></script> </head> <body> <p>Un párrafo cualquiera.</p> </body> </html> |
Podemos comprobar que se ha incluido el atributo src, que indica la ruta al archivo a incluir o enlazar. Vemos tambien que un archivo JavaScript ha de tener la extensión .js y para crearlos podemos utilizar cualquier editor de texto sin formato como el Bloc de Notas de windows y asegurarnos de guardarlo con la extensión js.
Al igual que ocurre con las hojas de estilo externas de Css, la ventaja principal de utilizar archivos javascript externos es el poder aplicarlo a un número ilimitado de páginas web a la vez. Si se dá el caso de querer modificar un dato del código, solo tenemos que hacer la modificación en el archivo javascript y automáticamente se verá reflejado este cambio
en todas las páginas que esten enlazadas a él.
3ª. Incluir Javascript en los mismos elementos del código html.
1 2 3 4 5 6 7 8 9 10 | <!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8" /> <title>Incluido en los elementos html de la página web.</title> </head> <body> <p onclick="alert("Esto es un mensaje cualquiera")">Un párrafo cualquiera.</p> </body> </html> |
No és muy recomendable utilizar este método, ya que en general cuanto más separado este el código html de restos de codigos, ya sea css, javascript o php tanto mejor. De esa forma haremos sitios más faciles de mantener y actualizar.