Usando datas com o objeto Date() do JavaScript
- Detalhes
- Angelo Luis Ferreira
- JavaScript
- Acessos: 11692
Neste tutorial vamos mostrar como obter datas com o JavaScrpt através do objeto Date(). Este objeto traz vários métodos para obter partes da data e hora.
Neste tutorial vamos mostrar como obter data e hora usando o objeto Date() do Javascript.
Instanciar o objeto Date()
Para utilizarmos o objeto Date() precisamos primeiro instanciar o objeto. Veja no exemplo abaixo como fazemos isso:
var data = new Date();
Observação: Quando você cria uma instância do objeto Date() sem especificar uma data, ela retorna um valor que representa a data e a hora atuais, incluindo ano, mês, dia, hora, minuto, segundo e milissegundo. Em seguida, será possível ler ou modificar os valores de data e hora através dos métodos do objeto:
Métodos do objeto Date()
O objeto Date() não possui propriedades, mas por outro lado, possui vários métodos. Veja a seguir alguns dos seus principais métodos:
getDate() | Retorna o dia do mês (de 1-31) |
getDay() | Retorna o dia da semana (de 0-6) - (zero = domingo) |
getFullYear() | Retorna o ano - (4 dígitos) |
getHours() | Retorna a hora (de 0-23) |
getMilliseconds() | Retorna milisegundos (de 0-999) |
getMinutes() | Retorna os minutos (de 0-59) |
getMonth() | Retorna o mês (de 0-11) - (zero = janeiro) |
getSeconds() | Retorna os segundos (de 0-59) |
getTime() | Retorna o número de milisegundos desde 01/01/1970 e especifica a data |
getTimezoneOffset() | Retorna a diferença do tempo entre UTC Time e local time, em minutos |
now() | Retorna o número de milisegundos desde 01/01/1970 |
parse() | Analisa uma string de data e retorna os milisegundos desde 01/01/1970 |
setDate() | Atualiza o dia do mês |
setFullYear() | Atualiza o ano |
setHours() | Atualiza a hora |
setMilliseconds() | Atualiza os milisegundos |
setMinutes() | Atualiza os minutos |
setMonth() | Atualiza o mês |
setSeconds() | Atualiza os segundos |
setTime() | Atualiza o número de milisegundos desde 01/01/1970 |
toString() | Converte uma data em uma string |
Aplicações
Exemplo 2: Utilizando métodos do objeto Date()
No exemplo abaixo, ao clicar no botão será informada a data e hora atual atualizada no padrão que definimos através dos métodos do objeto Date().
<script>
//função para mostrar o resultado
function resultado() {
// Obtém a data/hora atual
var data = new Date();
// Guarda cada parte em uma variável
var dia = data.getDate(); // 1-31
var dia_sem = data.getDay(); // 0-6 (zero=domingo)
var mes = data.getMonth(); // 0-11 (zero=janeiro)
var ano4 = data.getFullYear(); // 4 dígitos
var hora = data.getHours(); // 0-23
var min = data.getMinutes(); // 0-59
var seg = data.getSeconds(); // 0-59
// Formata a data e a hora (note o mês + 1)
var data_atual = dia + '/' + (mes+1) + '/' + ano4;
var hora_atual = hora + ':' + min + ':' + seg;
// Mostra resultado no id = "demo"
var x = document.getElementById("demo");
x.innerHTML = 'Hoje é ' + data_atual + ' às ' + hora_atual;
x.style.color = "#0000FF";
}
</script>
No exemplo abaixo, ao clicar no botão será informada a data atual atualizada com dia da semana e mês descritos por extenso.
<script>
//função para mostrar o resultado
function resultado() {
// Obtém a data/hora atual
var data = new Date();
var mesExtenso = Array("Janeiro", "Fevereiro", "Março",
"Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro",
"Outubro", "Novembro", "Dezembro");
var diaSemanaExtenso = Array("Domingo", "Segunda-Feira","Terceira-Feira",
"Quarta-Feira","Quinta-Feira",
"Sexta-Feira", "Sábado");
// Guarda cada parte em uma variável
var dia = data.getDate(); // 1-31
var dia_sem = data.getDay(); // 0-6 (zero=domingo)
var mes = data.getMonth(); // 0-11 (zero=janeiro)
var ano4 = data.getFullYear(); // 4 dígitos
var hora = data.getHours(); // 0-23
var min = data.getMinutes(); // 0-59
var seg = data.getSeconds(); // 0-59s
// Formata a data e a hora (note o mês + 1)
var data_atual = diaSemanaExtenso[dia_sem] + ', ' + dia + ' de '+ mesExtenso[mes] + ' de ' + ano4;
var hora_atual = hora + ':' + min + ':' + seg;
var x = document.getElementById("demo");
x.innerHTML = 'Hoje é ' + data_atual + ' às ' + hora_atual;
x.style.color = "#0000FF";
}
</script>
No exemplo abaixo, vamos apresentar um exemplo com data e hora atualizadas automaticamente a cada segundo:
<script>
//função para mostrar o resultado
function resultado() {
// Obtém a data/hora atual
var data = new Date();
var mesExtenso = Array("Janeiro", "Fevereiro", "Março",
"Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro",
"Outubro", "Novembro", "Dezembro");
var diaSemanaExtenso = Array("Domingo", "Segunda-Feira",
"Terceira-Feira","Quarta-Feira","Quinta-Feira",
"SextaFeira", "Sábado");
// Guarda cada parte em uma variável
var dia = data.getDate(); // 1-31
var dia_sem = data.getDay(); // 0-6 (zero=domingo)
var mes = data.getMonth(); // 0-11 (zero=janeiro)
var ano4 = data.getFullYear(); // 4 dígitos
var hora = data.getHours(); // 0-23
var min = data.getMinutes(); // 0-59
var seg = data.getSeconds(); // 0-59s
// Formata a data e a hora (note o mês + 1)
var data_atual = diaSemanaExtenso[dia_sem] + ', ' + dia + ' de '+ mesExtenso[mes] + ' de ' + ano4;
var hora_atual = hora + ':' + min + ':' + seg;
var x = document.getElementById("demo");
x.innerHTML = hora_atual + ' - ' + data_atual;
x.style.color = "#0000FF";
setTimeout("resultado()",1000); //reinicia a função a cada 1 segundo
}
</script>
Documentação Oficial
1. [Objeto Date()] » Referência W3Scholl.
O anúncio abaixo ajuda manter o Portal Visual Dicas