Todo lo que necesitas saber sobre la etiqueta script en HTML5

La etiqueta <script> es una de las más importantes en HTML5. Permite la inclusión de código JavaScript en una página web, lo que significa que se pueden realizar todo tipo de operaciones dinámicas, desde animaciones hasta formularios interactivos.

En esta publicación, te mostraremos todo lo que necesitas saber sobre la etiqueta <script>, incluyendo su sintaxis, sus atributos, y las mejores prácticas para su uso.

Sintaxis de la etiqueta <script>

La sintaxis de la etiqueta <script> es bastante sencilla:

<script>
    // Código JavaScript
</script>

El código JavaScript se coloca entre las etiquetas <script> y </script>. Por lo general, se recomienda que el código JavaScript se coloque en un archivo separado, en lugar de dentro de la página HTML. De esta manera, se puede mantener el código organizado y se pueden reutilizar los archivos de JavaScript en varias páginas web.

Para incluir un archivo de JavaScript externo, se utiliza el atributo "src" de la etiqueta <script>, de la siguiente manera:

<script src="ruta-del-archivo.js"></script>

Atributos de la etiqueta <script>

Además del atributo "src" que ya hemos mencionado, la etiqueta <script> también tiene otros atributos útiles. A continuación, te mostramos algunos de los más importantes:

• type: indica el tipo de contenido que se encuentra dentro de las etiquetas <script>. Por lo general, se establece en "text/javascript".
• async: indica que el archivo JavaScript se puede descargar de forma asíncrona, lo que significa que no se bloqueará la carga de la página. Este atributo es especialmente útil si se carga código JavaScript externo.
• defer: similar al atributo "async", indica que el archivo JavaScript se puede descargar de forma asíncrona, pero se ejecutará después de que se cargue la página.

Mejores prácticas para el uso de la etiqueta <script>

A continuación, te mostramos algunas de las mejores prácticas que se deben seguir al utilizar la etiqueta <script>:

• Coloca el código JavaScript en un archivo externo, en lugar de dentro de la página HTML.
• Si es posible, carga los archivos JavaScript al final de la página, justo antes del cierre de la etiqueta </body>. De esta manera, se puede mejorar la velocidad de carga de la página.
• Utiliza el atributo "defer" si es posible, ya que esto permitirá que el código JavaScript se descargue de forma asíncrona sin bloquear la carga de la página.
• Comprime y minimiza los archivos JavaScript antes de cargarlos en la página. Esto reducirá el tamaño de los archivos y mejorará la velocidad de carga de la página.