LuisCaveroWEB

Explicación de la tarea

Se presenta, a continuación, el código de un reloj que se actualiza cada segundo

<!DOCTYPE html>
<html>
     <head>
          <title>Reloj</title>
          <meta charset="UTF-8">
          <script type="text/javascript">
               function mostrar_fecha () {
                    var cl = document.getElementById("fecha");
                    cl.innerHTML = new Date()
               }
          </script>
     </head>
     <body>
          <h2>Reloj</h2>
          <div id="fecha"></div>
          <script type="text/javascript">
               mostrar_fecha();     // Muestra la fecha al cargar
               setInterval(mostrar_fecha, 1000);     // Actualiza la fecha cada segundo
          </script>
     </body>
</html>

Modificar el reloj del ejemplo anterior para que presente:

- Horas, minutos, segundos y milisegundos con el formato: 12 horas, 23 minutos, 10 segundos, 123 ms.
- Se recomienda variar el intervalo del evento a 1 ms.
- Utilizar métodos que extraen de un objeto Date: horas, min., seg. y ms. getHours(), getMinutes(), getSeconds() y getMilliseconds()
- Modificar el formato de presentación en mostrar_hora()
- Hacer que el reloj pare al hacer click sobre él (si está en marcha) y que vuelva a arrancar al hacer click sobre él cuando esté parado.
- Utilizar addEventListener(...) para añadir manejadores.

Tutoriales

- Tutorial Date
- Tutorial timers

Solución