//

La integración de javaScript con HTML

La forma más sencilla de desarrollar en javaScript es tomando como base un página HTML. Sólo necesitamos un editor de texto y un navegador. La integración de un lenguaje en otro, javaScript en HTML, se realiza con la etiqueta <script>, en la apertura y </script> en el cierre. De esta forma el contenido será interpretado y/o ejecutado según se vaya cargando la página.

Es recomendable utilizar esta etiqueta, la de apertura, junto con el atributo type para especificar al navegador que vamos a introducir código javaScript. Veamos la sintaxis:

<script type="text/javascript">
   //nuestro código
</script>

Cuando lo que tenemos es un código extenso y queremos usarlo en varias páginas, lo que se hace es guardar ese código en un fichero ‘.js’ y, este fichero, se incluye en las páginas de uso a través del atributo src de la etiqueta script. Esta técnica supone menor esfuerzo y, por supuesto, se mejora a la hora de mantener el código.

<script type="text/javascript" src="mi-codigo.js"></script>

En este caso, si escribimos código adicional dentro de la etiqueta <script>, este será ignorado por el navegador, dado que el atributo src tiene preferencia.

<script type="text/javascript" src="mi-codigo.js">
   Este texto no se va a ejecutar
</script>

Cuando queremos hacer que este script quede integrado con el código HTML, debemos tener en cuenta que tenemos dos ubicaciones posibles donde poder situar nuestro código el número de veces que se quiera.

1.- Dentro de la etiqueta <head>: Esta posición se utiliza normalmente para cargar ficheros externos que se utilizarán en otras partes de la misma página.

2.- Dentro de la etiqueta <body>: Aquí se coloca habitualmente el código que va a realizar acciones sobre la página, pudiendo hacer referencia a parte del código cargado dentro de <head>

<html>
<head>
   <script type="text/javascript" src="mi-codigo.js"></script>
</head>
<body>
   <script type="text/javascript">
      //aquí instrucciones en javaScript con las operaciones oportunas
   </script>
</body>
</html>

Deja una respuesta