SlideShare uma empresa Scribd logo
1 de 8
PáginasWeb com: HTML, CSS e JavaScript
Profª. Marlene da Silva Maximiano de Oliveira
& Profª. Alessandra Aparecida da Silva
JavaScript –Trabalhando com Data e Hora
// Formata a data e a hora (note o mês + 1)
var str_data = dia + '/' + (mes+1) + '/' + ano4;
var str_hora = hora + ':' + min + ':' + seg;
// Mostra o resultado
document.write('Hoje é ' + str_data + ' às ' + str_hora);
var data = new Date();
var dias = new Array(
'domingo','segunda-feira','terça-feira','quarta-feira','quinta-
feira','sexta-feira','sábado'
);
document.write("<br>" + dias[data.getDay()]);
// Note a pegadinha do mês, que inicia com zero e não um. Se você
não somar 1, janeiro aparecerá como 0
//e dezembro como 11. Já o dia do mês vai de 1 a 31, não é preciso
somá-lo.
//O dia da semana também inicia em zero, representando o domingo,
e vai até seis (sábado).
//Use um array para mostrar o dia da semana por extenso: //
</script>
<script>
// Obtém a data/hora atual
var data = new Date();
// Guarda cada pedaço 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 ano2 = data.getYear(); // 2 dígitos
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
var mseg = data.getMilliseconds(); // 0-999
var tz = data.getTimezoneOffset(); // em minutos
Datas – Exemplo 1
Exemplo no navegador
horaImprimivel = hora2 + " : " + minuto2 + " : " + segundo2
document.form_relogio.relogio.value = horaImprimivel
setTimeout("moveRelogio()",1000)
}
</script>
</head>
<body onload="moveRelogio()">
Vemos aqui o relógio funcionando...
<form name="form_relogio">
<input type="text" name="relogio" size="10">
</form>
</body>
</html>
if (segundo < 10){
segundo2 = "0" + segundo}
else{
segundo2 = segundo}
if (hora < 10){
hora2 = "0" + hora}
else{
hora2 = hora}
if (minuto < 10){
minuto2 = "0" + minuto}
else{
minuto2 = minuto}
<html>
<head>
<title>Relogio com Javascript</title>
<script language="JavaScript">
function moveRelogio(){
momentoAtual = new Date()
hora = momentoAtual.getHours()
minuto = momentoAtual.getMinutes()
segundo = momentoAtual.getSeconds()
Datas – Exemplo 2
Exemplo no navegador
<Script Language="JavaScript">
<!--
mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday = mydate.getDate();
myyear = mydate.getFullYear();
weekday = myweekday;
if(myday == 0)
day = " Domingo, "
else if(myday == 1)
day = " Segunda - Feira, "
else if(myday == 2)
day = "Terça - Feira, "
else if(myday == 3)
day = " Quarta - Feira, "
else if(myday == 4)
day = " Quinta - Feira, "
else if(myday == 5)
day = " Sexta - Feira, "
else if(myday == 6)
day = " Sábado, "
if(mymonth == 0)
month = "Janeiro "
else if(mymonth ==1)
month = "Fevereiro "
else if(mymonth ==2)
month = "Março "
else if(mymonth ==3)
month = "Abril "
else if(mymonth ==4)
month = "Maio "
else if(mymonth ==5)
month = "Junho "
else if(mymonth ==6)
month = "Julho "
else if(mymonth ==7)
month = "Agosto "
else if(mymonth ==8)
month = "Setembro “
else if(mymonth ==9)
month = "Outubro "
else if(mymonth ==10)
month = "Novembro "
else if(mymonth ==11)
month = "Dezembro "
document.write("<font face=arial,
size=12>"+ day);
document.write(myweekday+" de
"+month+ " de " + myyear+ "."+
"</font>");
// -->
</script>
Datas – Exemplo 3
Exemplo no navegador

Mais conteúdo relacionado

Mais de Centro Paula Souza

Mais de Centro Paula Souza (20)

15 CSS - Trabalhando com fontes
15 CSS - Trabalhando com fontes15 CSS - Trabalhando com fontes
15 CSS - Trabalhando com fontes
 
14 CSS Introdução
14 CSS Introdução14 CSS Introdução
14 CSS Introdução
 
07 Modelagem de banco de dados: Modelo Físico
07 Modelagem de banco de dados: Modelo Físico07 Modelagem de banco de dados: Modelo Físico
07 Modelagem de banco de dados: Modelo Físico
 
06 Modelagem de banco de dados: Modelo Lógico
06  Modelagem de banco de dados: Modelo Lógico06  Modelagem de banco de dados: Modelo Lógico
06 Modelagem de banco de dados: Modelo Lógico
 
05 Modelagem de banco de dados: Modelo Conceitual
05  Modelagem de banco de dados: Modelo Conceitual05  Modelagem de banco de dados: Modelo Conceitual
05 Modelagem de banco de dados: Modelo Conceitual
 
08 Trabalhando com mais de uma tabela (Relacionamento)
08 Trabalhando com mais de uma tabela (Relacionamento)08 Trabalhando com mais de uma tabela (Relacionamento)
08 Trabalhando com mais de uma tabela (Relacionamento)
 
07 Consultando os dados de uma tabela
07 Consultando os dados de uma tabela07 Consultando os dados de uma tabela
07 Consultando os dados de uma tabela
 
06 Trabalhando com registros
06 Trabalhando com registros06 Trabalhando com registros
06 Trabalhando com registros
 
10 Java Script - Exemplos práticos
10 Java Script - Exemplos práticos10 Java Script - Exemplos práticos
10 Java Script - Exemplos práticos
 
09 Java Script - As formas de usar
09  Java Script  - As formas de usar09  Java Script  - As formas de usar
09 Java Script - As formas de usar
 
13 Java Script - Validação de formulário
13 Java Script  - Validação de formulário13 Java Script  - Validação de formulário
13 Java Script - Validação de formulário
 
11 Java Script - Exemplos com eventos
11 Java Script - Exemplos com eventos11 Java Script - Exemplos com eventos
11 Java Script - Exemplos com eventos
 
08 Java Script Introdução - Teoria
08 Java Script   Introdução  - Teoria08 Java Script   Introdução  - Teoria
08 Java Script Introdução - Teoria
 
04 modelagem de dados introdução
04  modelagem de dados   introdução04  modelagem de dados   introdução
04 modelagem de dados introdução
 
03 Criando um banco de dado no Microsoft Access
03 Criando um banco de dado no Microsoft Access03 Criando um banco de dado no Microsoft Access
03 Criando um banco de dado no Microsoft Access
 
02 banco de dados relacional
02 banco de dados relacional02 banco de dados relacional
02 banco de dados relacional
 
01 noções de banco de dados
01 noções de banco de dados01 noções de banco de dados
01 noções de banco de dados
 
07 html formulários
07 html   formulários07 html   formulários
07 html formulários
 
06 html links e frames
06 html   links e frames06 html   links e frames
06 html links e frames
 
05 html tabelas
05 html   tabelas05 html   tabelas
05 html tabelas
 

Último

Artigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.pptArtigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.ppt
RogrioGonalves41
 
Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...
Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...
Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...
azulassessoria9
 
atividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdf
atividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdfatividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdf
atividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdf
Autonoma
 

Último (20)

Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptxMonoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
 
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
 
Polígonos, Diagonais de um Polígono, SOMA DOS ANGULOS INTERNOS DE UM POLÍGON...
Polígonos, Diagonais de um Polígono, SOMA DOS ANGULOS INTERNOS DE UM  POLÍGON...Polígonos, Diagonais de um Polígono, SOMA DOS ANGULOS INTERNOS DE UM  POLÍGON...
Polígonos, Diagonais de um Polígono, SOMA DOS ANGULOS INTERNOS DE UM POLÍGON...
 
3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx
 
Historia de Portugal - Quarto Ano - 2024
Historia de Portugal - Quarto Ano - 2024Historia de Portugal - Quarto Ano - 2024
Historia de Portugal - Quarto Ano - 2024
 
Pesquisa Ação René Barbier Livro acadêmico
Pesquisa Ação René Barbier Livro  acadêmicoPesquisa Ação René Barbier Livro  acadêmico
Pesquisa Ação René Barbier Livro acadêmico
 
Texto dramático com Estrutura e exemplos.ppt
Texto dramático com Estrutura e exemplos.pptTexto dramático com Estrutura e exemplos.ppt
Texto dramático com Estrutura e exemplos.ppt
 
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
 
Cópia de AULA 2- ENSINO FUNDAMENTAL ANOS INICIAIS - LÍNGUA PORTUGUESA.pptx
Cópia de AULA 2- ENSINO FUNDAMENTAL ANOS INICIAIS - LÍNGUA PORTUGUESA.pptxCópia de AULA 2- ENSINO FUNDAMENTAL ANOS INICIAIS - LÍNGUA PORTUGUESA.pptx
Cópia de AULA 2- ENSINO FUNDAMENTAL ANOS INICIAIS - LÍNGUA PORTUGUESA.pptx
 
Cartão de crédito e fatura do cartão.pptx
Cartão de crédito e fatura do cartão.pptxCartão de crédito e fatura do cartão.pptx
Cartão de crédito e fatura do cartão.pptx
 
Sistema de Bibliotecas UCS - Cantos do fim do século
Sistema de Bibliotecas UCS  - Cantos do fim do séculoSistema de Bibliotecas UCS  - Cantos do fim do século
Sistema de Bibliotecas UCS - Cantos do fim do século
 
Camadas da terra -Litosfera conteúdo 6º ano
Camadas da terra -Litosfera  conteúdo 6º anoCamadas da terra -Litosfera  conteúdo 6º ano
Camadas da terra -Litosfera conteúdo 6º ano
 
Artigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.pptArtigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.ppt
 
Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...
Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...
Considerando as pesquisas de Gallahue, Ozmun e Goodway (2013) os bebês até an...
 
Educação Financeira - Cartão de crédito665933.pptx
Educação Financeira - Cartão de crédito665933.pptxEducação Financeira - Cartão de crédito665933.pptx
Educação Financeira - Cartão de crédito665933.pptx
 
Aula prática JOGO-Regencia-Verbal-e-Nominal.pdf
Aula prática JOGO-Regencia-Verbal-e-Nominal.pdfAula prática JOGO-Regencia-Verbal-e-Nominal.pdf
Aula prática JOGO-Regencia-Verbal-e-Nominal.pdf
 
aula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.pptaula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.ppt
 
atividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdf
atividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdfatividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdf
atividade-de-portugues-paronimos-e-homonimos-4º-e-5º-ano-respostas.pdf
 
P P P 2024 - *CIEJA Santana / Tucuruvi*
P P P 2024  - *CIEJA Santana / Tucuruvi*P P P 2024  - *CIEJA Santana / Tucuruvi*
P P P 2024 - *CIEJA Santana / Tucuruvi*
 
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de LedAula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
 

12 Java Script - Trabalhando com datas

  • 1. PáginasWeb com: HTML, CSS e JavaScript Profª. Marlene da Silva Maximiano de Oliveira & Profª. Alessandra Aparecida da Silva
  • 3. // Formata a data e a hora (note o mês + 1) var str_data = dia + '/' + (mes+1) + '/' + ano4; var str_hora = hora + ':' + min + ':' + seg; // Mostra o resultado document.write('Hoje é ' + str_data + ' às ' + str_hora); var data = new Date(); var dias = new Array( 'domingo','segunda-feira','terça-feira','quarta-feira','quinta- feira','sexta-feira','sábado' ); document.write("<br>" + dias[data.getDay()]); // Note a pegadinha do mês, que inicia com zero e não um. Se você não somar 1, janeiro aparecerá como 0 //e dezembro como 11. Já o dia do mês vai de 1 a 31, não é preciso somá-lo. //O dia da semana também inicia em zero, representando o domingo, e vai até seis (sábado). //Use um array para mostrar o dia da semana por extenso: // </script> <script> // Obtém a data/hora atual var data = new Date(); // Guarda cada pedaço 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 ano2 = data.getYear(); // 2 dígitos 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 var mseg = data.getMilliseconds(); // 0-999 var tz = data.getTimezoneOffset(); // em minutos Datas – Exemplo 1
  • 5. horaImprimivel = hora2 + " : " + minuto2 + " : " + segundo2 document.form_relogio.relogio.value = horaImprimivel setTimeout("moveRelogio()",1000) } </script> </head> <body onload="moveRelogio()"> Vemos aqui o relógio funcionando... <form name="form_relogio"> <input type="text" name="relogio" size="10"> </form> </body> </html> if (segundo < 10){ segundo2 = "0" + segundo} else{ segundo2 = segundo} if (hora < 10){ hora2 = "0" + hora} else{ hora2 = hora} if (minuto < 10){ minuto2 = "0" + minuto} else{ minuto2 = minuto} <html> <head> <title>Relogio com Javascript</title> <script language="JavaScript"> function moveRelogio(){ momentoAtual = new Date() hora = momentoAtual.getHours() minuto = momentoAtual.getMinutes() segundo = momentoAtual.getSeconds() Datas – Exemplo 2
  • 7. <Script Language="JavaScript"> <!-- mydate = new Date(); myday = mydate.getDay(); mymonth = mydate.getMonth(); myweekday = mydate.getDate(); myyear = mydate.getFullYear(); weekday = myweekday; if(myday == 0) day = " Domingo, " else if(myday == 1) day = " Segunda - Feira, " else if(myday == 2) day = "Terça - Feira, " else if(myday == 3) day = " Quarta - Feira, " else if(myday == 4) day = " Quinta - Feira, " else if(myday == 5) day = " Sexta - Feira, " else if(myday == 6) day = " Sábado, " if(mymonth == 0) month = "Janeiro " else if(mymonth ==1) month = "Fevereiro " else if(mymonth ==2) month = "Março " else if(mymonth ==3) month = "Abril " else if(mymonth ==4) month = "Maio " else if(mymonth ==5) month = "Junho " else if(mymonth ==6) month = "Julho " else if(mymonth ==7) month = "Agosto " else if(mymonth ==8) month = "Setembro “ else if(mymonth ==9) month = "Outubro " else if(mymonth ==10) month = "Novembro " else if(mymonth ==11) month = "Dezembro " document.write("<font face=arial, size=12>"+ day); document.write(myweekday+" de "+month+ " de " + myyear+ "."+ "</font>"); // --> </script> Datas – Exemplo 3