HTML5, Javascript, introducción

La finalidad de Javascript es agregar interactividad y dinamismo a la página web. El código Javascript se puede colocar en los mismos lugares que el código CSS, es decir, en las mismas etiquetas (en línea), en la cabecera (normalmente) de nuestra página web, dentro de las etiquetas <script></script>o en una página externa.

Código in line (en línea)

Veamos un ejm fácil

<!DOCTYPE html>
<html lang="es">
    <head>
    </head>
    <body>
        <p onClick="alert('Hola');">Estudiando Javascript</p>
    </body>
</html>

La palabra onClick es lo que se denomina un evento.

Código dentro del <head>

Veamos un ejm. Una pequeña peculiaridad, si tenemos que incluir CSS también, lo normal es que el script vaya antes que el CSS

<!DOCTYPE html>
<html lang="es">
    <head>
        <script>
            alert("Hola que hay de nuevo");
        </script>
    </head>
    <body>
        <p>Estudiando Javascript</p>
    </body>
</html>

Ahora lo que va a ocurrir es que el alert se va a ejecutar enseguida ya que es lo primero que va a leerse, además de esto, el alert, al parar la ejecución del programa, no va a dejar ver los elementos que van después de él hasta que no le demos a Aceptar y se siga cargando la página.

Javascript en un archivo independiente

Vemos un ejm, escribimos primero el archivo HTML

<!DOCTYPE html>
<html lang="es">
    <head>
        <script src="ejm02.js"></script>
    </head>
    <body>
        <p onClick="prueba();">Estudiando Javascript</p>
    </body>
</html>

Y ahora escribimos el archivo Javascript

function prueba(){
    alert("Que hay de nuevo");
}

NOTA: Un evento es el desencadenante de la acción