Si alguna vez has explorado el fascinante mundo del desarrollo web, seguramente habrás oído hablar de la etiqueta «script» en HTML. Esta etiqueta es esencial para incorporar interactividad y dinamismo a tus páginas web. En este artículo, enseñaremos que es, como utilizarla y la sintaxis de la etiqueta script en HTML, exploraremos sus atributos y ejemplos para comprender cómo puedes utilizarla de manera correcta en tus proyectos de desarrollo web.
Introducción a la Etiqueta Script en HTML
La etiqueta «script» en HTML es una de las piedras angulares de la programación web. Se utiliza para incrustar código JavaScript directamente en una página HTML, lo que permite la ejecución de scripts en el lado del cliente. Esto abre un abanico de posibilidades para crear páginas web interactivas y dinámicas.
Sintaxis Básica de la Etiqueta Script
Antes de profundizar en los atributos y ejemplos, es importante comprender la sintaxis básica de la etiqueta «script» en HTML. Aquí tienes un ejemplo:
La etiqueta «script» se coloca dentro del elemento «head» o «body» del documento HTML y puede contener código JavaScript o referencias a archivos externos.
Atributos de la Etiqueta Script
La etiqueta «script» en HTML admite varios atributos que controlan su comportamiento y funcionalidad. Aquí te presentamos algunos de los atributos más utilizados:
1. src
El atributo «src» se utiliza para especificar la fuente (URL) de un archivo JavaScript externo que se va a incluir en la página. Esto es útil para mantener el código organizado y reutilizable.
Ejemplo:
<script src="mi-script.js"></script>
2. type
El atributo «type» indica el tipo de lenguaje de script que se encuentra dentro de la etiqueta «script». El valor comúnmente utilizado es «text/javascript» para JavaScript.
Ejemplo:
<script type="text/javascript"> // Tu código JavaScript aquí </script>
3. async y defer
Estos atributos controlan la forma en que se carga y ejecuta el script. «async» indica que el script se ejecutará de forma asincrónica, mientras que «defer» aplaza la ejecución del script hasta que la página se cargue completamente.
Ejemplo:
<script src="mi-script.js" async></script>
4. charset
El atributo «charset» permite especificar la codificación de caracteres del script. Esto es útil en situaciones donde el script utiliza caracteres especiales.
Ejemplo:
<script src="mi-script.js" charset="UTF-8"></script>
Ejemplos de Uso de la Etiqueta Script
Para comprender mejor cómo funciona la etiqueta «script» en HTML, veamos algunos ejemplos prácticos:
1. Alerta Simple
<script type="text/javascript"> alert("¡Hola, mundo!"); </script>
Este sencillo script muestra un cuadro de alerta con el mensaje «¡Hola, mundo!», cuando se carga la página.
2. Manipulación del DOM
<script type="text/javascript"> document.getElementById("mi-elemento").innerHTML = "Texto modificado"; </script>
Este ejemplo utiliza JavaScript para cambiar el contenido de un elemento HTML con el (id «mi-elemento»).
Conclusión
En resumen, la etiqueta «script» en HTML es una herramienta poderosa que permite la incorporación de código JavaScript en tus páginas web. Con una comprensión sólida de sus atributos y ejemplos de uso, puedes mejorar la interactividad y dinamismo de tus proyectos web.