Data e Timer

Índice da página:
Conversão Data

Existe apenas uma função para que se possa obter a data e a hora. É a função Date(). Esta função devolve data e hora no formato: Dia da semana, Nome do mês, Dia do mês, Hora, Minuto, Segundo, Index e Ano.
Para se extrair os dados da função, existem as seguintes funções:

• getDate() - Obtém o dia do mês (numérico de 1 a 31).
•getDay() - Obtém o dia da semana (0 a 6).
•getMonth() - Obtém o mês (numérico de 0 a 11).
•getYear() - - Obtém o ano.
•getHours() - Obtém a hora (numérico de 0 a 23).
•getMinutes() - Obtém os minutos (numérico de 0 a 59).
•getSeconds() - Obtém os segundos (numérico de 0 a 59).

Para criar uma nova instância da função Date existe o método set. Assim, temos os seguintes métodos: setDate, setDay, setMonth, setYear, setHours, setMinutes e setSeconds.
Por exemplo para mudar o mês para Novembro, teríamos: Data=new Date(); Data.setMonth(10).
No exemplo a seguir mostraremos uma tabela da extracção Data na função Date.
Criaremos uma tabela para Dia da Semana e Mês.
Mostraremos a Data correspondente ao Index da tabela de extracção.

Exemplo:

<html>
<head>
<title>Mostrando Data</title>

<script language="JavaScript" type="text/javascript">
Data = new Date() 
Dia=Data.getDate()
DiaSemana=Data.getDay()
Mes=Data.getMonth()
Ano=Data.getYear()
Hora=Data.getHours()
Minuto=Data.getMinutes()
Segundo=Data.getSeconds()

function CriaArray(n) { 
   this.length = n 
   for (var i = 1 ; i <= n ; i++) {
      this[i] = "" }}

   NomeDia = new CriaArray(7)
   NomeDia[0] = "Domingo "
   NomeDia[1] = "Segunda-feira " 
   NomeDia [2] = "Terça-feira " 
   NomeDia[3] = "Quarta-feira " 
   NomeDia[4] = "Quinta-feira " 
   NomeDia[5] = "Sexta-feira "
   NomeDia[6] = "Sábado "

   NomeMes = new CriaArray(12)
   NomeMes[0] = " de Janeiro de "
   NomeMes[1] = " de Fevereiro de " 
   NomeMes[2] = " de Março de " 
   NomeMes[3] = " de Abril de " 
   NomeMes[4] = " de Maio de " 
   NomeMes[5] = " de Junho de "
   NomeMes[6] = " de Julho de "
   NomeMes[7] = " de Agosto de "
   NomeMes[8] = " de Setembro de "
   NomeMes[9] = " de Outubro de "
   NomeMes[10] = " de Novembro de "
   NomeMes[11] = " de Dezembro de "
</script>
	
</head>
<body topmargin="0" leftmargin="0">
<div>Extracção Data:
<table align="center" cellpadding="0" cellspacing="0" border="1">
   <tr bgcolor="#184A4A">
   <td>Dia Semana</td><td>Dia</td><td>Mês</td><td>Ano</td>
	<td>Hora</td><td>Minutos</td><td>Segundos</td></tr>

<script>
   document.write("<tr align='center'><td>"+DiaSemana+"</td><td>"+Dia+"</td>")
   document.write("<td>"+Mes+"</td><td>"+Ano+"</td><td>")
   document.write(+Hora+"</td><td>"+Minuto+"</td><td>"+Segundo+"</td></tr>")
</script>

</table>
Conversão Data Português:<br>
Hoje: 

<script>
   if (Hora <10){ Hora="0"+Hora}
   if (Minuto <10){ Minuto="0"+Minuto}
   if (Segundo <10){ Segundo="0"+Segundo}
   document.write(NomeDia[DiaSemana]+Dia+NomeMes[Mes]+Ano+" ")
   document.write(Hora+":"+Minuto+":"+Segundo)
</script>

</div>
</body>
</html>
Ver Índice
Contadores

É um método que permite a programação para que uma determinada acção só ocorra após o transcurso de um determinado tempo.

Variável = setTimeout ("ação", tempo)

Variável é uma variável apenas para controlo do timer.
ação é a ação que se quer realizar.
tempo é o tempo de espera para que a ação ocorra, em milisegundos.

Nota: É importante observar que a acção só ocorrerá uma vez. Para que a acção volte a ocorrer, será necessário repetir o comando dentro da ação, obtendo-se, assim, um loop. Para interromper um loop, provocado pela forma acima, deve-se utilizar o seguinte método:

clearTimeout (Variável)

Onde: Variável é o nome da variável de controle do timer.
No exemplo que apresentamos poderá ver um relógio e um contador com opção de paragem, alteração de Tempo de Intervalo e reset do contador.

Exemplo:

<html>
<head>
<title>Timer Contador</title>
<script> 
var Contador=0
var Intervalo=100

function Relogio() { 
   res=setTimeout("Relogio()", Intervalo) 
   Data=new Date() 
   Hora = Data.getHours() 
   Min = Data.getMinutes() 
   Seg = Data.getSeconds()
   if (Hora<10){Hora="0"+Hora} 
   if (Min<10){Min="0"+Min} 
   if (Seg<10){Seg="0"+Seg} 
   HoraActual=Hora+":"+Min+":"+Seg
   ++Contador
   document.Teste.Hora.value=HoraActual 
   document.Teste.conta.value=Contador} 

function Decimo(){
   Intervalo=100}

function Segundo(){
   Intervalo=1000}

function Reset(){
   Contador=0
   document.Teste.conta.value=Contador}
</script>
</head> 
<body topmargin="0" leftmargin="0">
<form name="Teste">
<table border="0" cellpadding="0" cellspacing="0" align="center">
   <tr align="center"><td>
      Hora: <input type="text" size="8" name="Hora"></td>
      <td>Contador: <input type="text" size="8" name="conta"></td></tr>
   <tr align="center"><td>
      <input type="radio" name="Relog" onclick="clearTimeout(res)" checked>Parar 
      <input type="radio" name="Relog" onclick="res=setTimeout('Relogio()', 1000)">Contar</td>
      <td style="padding-left:20px">
      <input type="radio" name="Interv" onclick="Decimo()" checked>0,1 Segundo
      <input type="radio" name="Interv" onclick="Segundo()">1 Segundo </td></tr>
   <tr align="center"><td></td>
      <td><input type="button" value="Reset" onclick="Reset()" class="bot"></td></tr>
</table>
</form> 
</body>
</html>
Ver Índice