-
Notifications
You must be signed in to change notification settings - Fork 0
/
core-objects(array-date-set_intervalo).html
106 lines (92 loc) · 3.99 KB
/
core-objects(array-date-set_intervalo).html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!doctype html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link href="image/js.ico" rel="shortcut icon" />
<link rel='stylesheet' href='css/style.css' type='text/css' />
<title>Javascript tutorial practicing</title>
</head>
<body>
<h1>Core Objects - Array, DateTime </h1>
<h2>setTimeout 1x e setInterval a cada tempo configurado</h2>
<section id="escolhap">
<b>Accessing an Array direto do html</b>
<br /> Busca todas as tags "span" e escreve a que foi escolhida, array 2 (exibe em 3seg.) usando o
"setInterval".
<br /><br />
array 0 = <span>Barry</span><br />
array 1 = <span>Allen</span><br />
array 2 = <span>The flash</span>
<br />
<br />
<strong id="demo">em 3 segundos aparecerá aqui</strong>
<script>
function minhaArray() {
var escolha = document.getElementsByTagName("span");
document.getElementById("demo").innerHTML = "Array 2 é: " + escolha[2].innerHTML;
}
setTimeout(minhaArray, 3000);
</script>
</section>
<section>
<b>Accessing an Array</b>
<br /> (com if else) Busca todas as listas de "radio button" e escreve um resultado</br><br />
Dentro da função do botão inserir após o click tempo de 3 segundos e mostrará resultado.
<br /><br />
Selecione qual super heroi o Barry Allen é? <br /><br />
<label><input type="radio" name="gender" class="meuscheckbox"> The Flash</label>
<br />
<label><input type="radio" name="gender" class="meuscheckbox"> He-man</label>
<br />
<label><input type="radio" name="gender" class="meuscheckbox"> Batman</label>
<br />
<br />
<input type="button" name="submit" value="Resultado" onclick="verResultado()">
<br /><br />
<strong id="demo2">resposta em 3 segundos aparecerá aqui</strong>
<script>
function verResultado() {
setTimeout(function () {
var checks = document.querySelectorAll(".meuscheckbox");
var declara = "";
if (checks[0].checked) {
declara = "Acertou!"
} else {
declara = "Errou ou não respondeu! Dica: pessoa mais rápida"
}
document.getElementById("demo2").innerHTML = declara;
}, 3000);
}
</script>
</section>
<section>
<b>Date Object</b>
<br />The Date Object = exibe o tempo/data
<br />Após o click mostra funções: hora (com minutos e segundos), Data (dia, mês e ano) e dia da semana.
<br />Recarrega a cada 1 minuto.
<br /><br />
<input type="button" name="submit" value="Mostrar data" onclick="printTime()">
<br /><br />
<h4 id="mostrar"></h4>
<script>
function printTime() {
setInterval(function () {
var meutempo = new Date();
var hora = meutempo.getHours();
var min = meutempo.getMinutes();
var sec = meutempo.getSeconds();
var dia = meutempo.getDate();
var meses = ["Jan", "Fev", "Mar", "Apr", "Mai", "Jun", "Jul", "Ago", "Set", "Octo", "Nov", "Dec"];
var ano = meutempo.getFullYear();
var semana = ["domingo", "Segunda", "Terça", "Quarta", "Quinta", "Sexta", "Sábado"];
document.getElementById("mostrar").innerHTML =
semana[meutempo.getDay()] + "<br/>" +
"Data: " + dia + " de " + meses[meutempo.getMonth()] + " de " + ano + "<br/>" +
"Hora: " + hora + ":" + min + ":" + sec;
}, 1000);
};
</script>
</section>
</body>
</html>