Quem nunca pensou em criar um cabeçalho que apresentasse a data e a hora automaticamente.
Aqui temos um exemplo prático de como criar a função e aplicar na página.
Espero que compartilhe e divulgue.
<!DOCTYPE html>
<html>
<head>
<title>Objetos em JavaScript</title>
<style type="text/css">
body{
margin:50px;
background:#4682B4;
}
.h5{
font-familly:serif;
color=white;
}
.minhaDIV, .divInterna{
text-align:center;
padding:5px;
border-radius:10px;
width:600px;
left:50%;
margin-left:300px;
height:relative;
color:white;
background:silver;
box-shadow: 5px -8px 20px rgba(1, 1, 1, 0.7);
}
.divInterna{
width:400px;
left:50%;
margin-left:200px;
}
.botao{
border-radius:2px;
}
</style>
<script type="text/javascript">
function escreverData(){
var nomeDoDia= new Array("domingo","segunda-feira","terça-feira","quarta-feira","quinta-feira","sexta-feira","sábado");
var nomeDoMes= new Array("Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho","Agosto","Setembro","Outubro","Novembro","Dezembro");
var agora = new Date();
var dia =agora.getDate();
hoje=new Date();
h=hoje.getHours();
m=hoje.getMinutes();
s=hoje.getSeconds();
setTimeout('escreverData()',500);
if(dia<10){
dia="0"+dia;
}
if(m<10){
m="0"+m;
}
if (h<10){
h="0"+h;
}
if (s<10){
s="0"+s;
}
document.getElementById("escrever").innerHTML = "<h5>São José dos Campos, São Paulo - Hoje é " + nomeDoDia[agora.getDay()] + ", " + dia + " de " + nomeDoMes[agora.getMonth()] + " de " + agora.getFullYear() + ". Horário de Brasília: " + h+" : "+m+" : "+s +"</h5>";
}
function horaAtual(){
hoje=new Date();
h=hoje.getHours();
m=hoje.getMinutes();
s=hoje.getSeconds();
//document.getElementById('txt').innerHTML=h+":"+m+":"+s;
setTimeout('horaAtual()',500);
}
</script>
</head>
<body onload="escreverData()">
<div id="principal" class="minhaDIV">
<p id="escrever" onload="escreverData()"></p>
</div>
</body>
</html>
Aqui temos um exemplo prático de como criar a função e aplicar na página.
Espero que compartilhe e divulgue.
<!DOCTYPE html>
<html>
<head>
<title>Objetos em JavaScript</title>
<style type="text/css">
body{
margin:50px;
background:#4682B4;
}
.h5{
font-familly:serif;
color=white;
}
.minhaDIV, .divInterna{
text-align:center;
padding:5px;
border-radius:10px;
width:600px;
left:50%;
margin-left:300px;
height:relative;
color:white;
background:silver;
box-shadow: 5px -8px 20px rgba(1, 1, 1, 0.7);
}
.divInterna{
width:400px;
left:50%;
margin-left:200px;
}
.botao{
border-radius:2px;
}
</style>
<script type="text/javascript">
function escreverData(){
var nomeDoDia= new Array("domingo","segunda-feira","terça-feira","quarta-feira","quinta-feira","sexta-feira","sábado");
var nomeDoMes= new Array("Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho","Agosto","Setembro","Outubro","Novembro","Dezembro");
var agora = new Date();
var dia =agora.getDate();
hoje=new Date();
h=hoje.getHours();
m=hoje.getMinutes();
s=hoje.getSeconds();
setTimeout('escreverData()',500);
if(dia<10){
dia="0"+dia;
}
if(m<10){
m="0"+m;
}
if (h<10){
h="0"+h;
}
if (s<10){
s="0"+s;
}
document.getElementById("escrever").innerHTML = "<h5>São José dos Campos, São Paulo - Hoje é " + nomeDoDia[agora.getDay()] + ", " + dia + " de " + nomeDoMes[agora.getMonth()] + " de " + agora.getFullYear() + ". Horário de Brasília: " + h+" : "+m+" : "+s +"</h5>";
}
function horaAtual(){
hoje=new Date();
h=hoje.getHours();
m=hoje.getMinutes();
s=hoje.getSeconds();
//document.getElementById('txt').innerHTML=h+":"+m+":"+s;
setTimeout('horaAtual()',500);
}
</script>
</head>
<body onload="escreverData()">
<div id="principal" class="minhaDIV">
<p id="escrever" onload="escreverData()"></p>
</div>
</body>
</html>

Nenhum comentário:
Postar um comentário