Temporização com JavaScript

No ambiente Web temporizadores são usados pra de tempos em tempos recarregar automaticamente as páginas.

Por exemplo, em intersítios de banco e bolsa de valores as cotações costumam ser atualizadas a cada 15 minutos pro internauta.

O exemplo abaixo mostra o horário a cada 1 segundo.
A rotina SetInterval informa o navegador pra ficar recarregando determinada rotina a certo intervalo de tempo (em milisegundos).


<html>
  <head>
    <script type="text/javascript">
      function Temporizar ()

      {
        var DataHora;

        DataHora     = new Date ();
        Relogio.value= DataHora.toLocaleTimeString ();
      }

      function Inicializar (Intervalo_MSeg)

      {
        Temporizar ();
        setInterval (Temporizar, Intervalo_MSeg);
      }
    </script>
  </head>
  <body onload="javascript: Inicializar (1000);">
    Horário: <input type="text" id="Relogio" style="color: Navy">
  </body>
</html>
Clique aqui pra abrir no navegador




Chateações com JavaScript

Os temporizadores também constumam ser usados pra fazer aqueles banners de chateação que ficam acompanhando o rolamento das páginas.
Neste exemplo SetInterval inicia a temporização e ClearInterval pára. 


<html>
   <head>
      <script type=text/javascript>
         var Sinal, Temporizador;

         Sinal       = true;
         Temporizador= "";

         function Temporizar ()

         {
            if (parseInt (Scramble.style.top) + 35 >= 400)
               Scramble.style.top= 80;
            else
               Scramble.style.top= parseInt (Scramble.style.top) + 10;

            if (Sinal)
               Scramble.style.left= 260;
            else
               Scramble.style.left= 300;

            Sinal= !Sinal;
         }

         function Inicializar (Intervalo_MSeg)

         {
            if (Temporizador == "") {
               Temporizar ();
               Temporizador= setInterval (Temporizar, Intervalo_MSeg);
            }
         }

         function Finalizar ()
         
         {
            if (Temporizador != "") {
               clearInterval (Temporizador);
               Temporizador= "";
            }
         }

      </script>
   </head>
   <body onload="javascript: Inicializar (150);">
      <input type="button" id="Inicio" value="Iniciar" onclick="javascript: Inicializar (150);">
      <br><br>
      <input type="button" id="Fim" value="Parar" onclick="javascript: Finalizar ();">
      <br>
<span id="Scramble" style="background-color:Red; position:absolute; top:80px; left:260px; height:35px">
   !!!O terrível e odioso Scramble!!!
</span>
   </body>
</html>
Clique aqui pra abrir no navegador