tecnologias para internet - 2016.2 - aula 6
TRANSCRIPT
Tecnologias para Internet
Prof.º Thyago Maia
Javascript
Mudar atributos de um elemento HTML
Exemplo
4
<!– Exemplo --><html>
<body>
<script> function mudaFigura() {
var imagem = document.getElementById(“imagem");if(imagem.src.match(“sport2”))
imagem.src = “sport.gif”;else
imagem.src = “sport2.gif”; } </script>
<img id=“imagem” src=“sport.gif” onclick=“mudaFigura()“>
</body>
</html>
Validando Dados
Exemplo
6
<!–- Exemplo --><html> <body>
<script> function validaNegativo() {
var numero = document.getElementById(“campo").value;if(numero >= 0)document.getElementById(“resp").innerHTML = “Inválido”;elsedocument.getElementById(“resp").innerHTML = “Válido”;
} </script>
Digite um número negativo: <input type=“text” id=“campo”> <button type=“button” onclick=“validaNegativo()“>Validar</button> <div id=“resp”></div>
</body></html>
Exercícios
Exercícios
• Faça um documento HTML que permita ao usuário digitar seu RG e CPF. Como tais campos são obrigatórios, faça um script que verifica se os campos realmente foram preenchidos.
8
Exercícios
9
<!– Exemplo -->
<html> <body>
<script> function obrigatorio(x) {
if(x.value == “”)alert(‘Campo obrigatório');
} </script>
RG: <input id=“rg" type="text“ onblur=“obrigatorio(this)” /><br/> CPF: <input id=“cpf" type="text“ onblur=“obrigatorio(this)” /><br/>
</body></html>
Exercícios
• Faça um documento HTML que permita ao usuário digitar sua idade. Em seguida, faça um script que receba a idade do indivíduo e informe se o mesmo atingiu a maioridade.
10
Exercícios
11
<!– Exemplo -->
<html> <body>
<script> function checa() {
if(document.getElementById('idade').value >= 18)
alert('É de maior');else
alert('É de menor');
} </script>
<input id="idade" type="text" /><br/> <button type="button" onclick="checa()">Checa</button>
</body></html>
Exercícios
• Faça um script que lê o salário base de um funcionário, calcula e mostra o salário a receber, sabendo-se que o funcionário tem gratificação de 5% sobre o salário base e paga imposto de 7% sobre este salário.
12
Exercícios
13
<!– Exemplo -->
<html> <body>
<script> function calcula() { var salario = document.getElementById('salario').value; var grat = salario * 0.05; var imposto = salario * 0.07; alert(parseFloat(salario) + parseFloat(grat) - parseFloat(imposto)); } </script>
<input id="salario" type="number" /><br/> <button type="button" onclick="calcula()">Calcula</button>
</body></html>