JavaScript: incluir código en una web

Forma parte de las notas sobre JavaScript.

JavaScript se aplica a una página HTML de manera similar a CSS, utilizando la etiqueta <script>. El código JavaScript se puede incluir directamente en el código HTML o desde un fichero externo.

JavaScript interno

Podemos añadir código JavaScript entre las etiquetas <script> en un documento HTML:

<!DOCTYPE html>
<html lang="es-ES">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Apply JavaScript example</title>
    <script>
      console.log("Soy código JavaScript");
    </script>
  </head>
  <body>
    <h1>Hola, mundo</h1>
  </body>
</html>

JavaScript externo

Si tenemos un fichero llamado scripts.js con código JavaScript:

console.log("Soy código JavaScript");

Podemos cargarlo desde una web mediante el atributo src de la etiqueta <script>:

<!DOCTYPE html>
<html lang="es-ES">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Apply JavaScript example</title>
    <script src="script.js" defer></script>
  </head>
  <body>
    <h1>Hola, mundo</h1>
  </body>
</html>

Usamos el atributo defer para indicarle al navegador que siga descargando el contenido HTML antes de ejecutar el script y así evitamos problemas de que no se puede aplicar algún código JavaScript sobre el HTML porque no esté completamente descargado.