Faça um script que peça ao usuário dois números e em seguida exiba o maior deles. Use JavaScript.
Tutorial anterior: IF e ELSE aninhados
Exibindo o Maior Número em JavaScript
Nosso código HTML:
Primeiro numero: <input id="num1" type="number"> <br /> Segundo numero :<input id="num2" type="number"> <br />
Depois, um botão escrito "Calcular maior", que ao ser clicado (atributo onclick) vai chamar a função maior() (declarada e definida em nosso script de JS):
<button onclick="maior()">Calcular maior</button>
Design da página feito, agora vamos para a parte da programação JavaScript em si.
Vamos lá fazer nossa função maior() .
Vamos declarar duas variáveis, numero1 e numero2, que vão pegar os valores inseridos no formulário num1 e num2.
Como esses dados vem no formato string, usamos a função parseFloat() pra transformar em float (tipo numérico decimal), fica assim:
var numero1 = parseFloat(document.getElementById("num1").value); var numero2 = parseFloat(document.getElementById("num2").value);
Prontinho, agora temos duas variáveis do tipo float em mãos, a numero1 e a numero2.
Vamos aos testes!
Primeiro, vamos testar com IF se o primeiro número é maior que o segundo.
Se for, pronto, acabou...exibimos um alert dizendo isso e acabou.
Se o primeiro não for maior que o segundo, é porque o segundo é maior que o primeiro, correto?
Errado !!!
Pois os dois podem ser iguais! Precisamos fazer outro teste!
Então, dentro do else fazemos mais um if para verificar se o número 2 é maior que o primeiro, se for, aí sim, exibimos essa informação.
Por fim, fazemos o else desse segundo if que foi aninhado. Se o primeiro número não é maior que o segundo, nem o segundo número é maior que o primeiro, é porque eles são iguais!
Veja como ficou nosso código:
<!DOCTYPE html> <html> <head> <title>Curso JavaScript Progressivo</title> Primeiro numero: <input id="num1" type="number"> <br /> Segundo numero :<input id="num2" type="number"> <br /> <button onclick="maior()">Maior</button> <script type="text/javascript"> function maior(){ var numero1 = parseFloat(document.getElementById("num1").value); var numero2 = parseFloat(document.getElementById("num2").value); if (numero1 > numero2) alert(numero1 + " eh maior que " + numero2); else if(numero2 > numero1) alert(numero2 + " eh maior que " + numero1); else alert(numero1 + " eh igual a " + numero2); } </script> </head> </html>
Como todas as instruções após IF e ELSE são comandos de apenas uma linha de código, não usamos chaves { }, pois não é necessário nesses casos.
Teste você mesmo o resultado:
Primeiro numero:
Segundo numero:
PS: Se quiser testar com números decimais, lembre-se de usar ponto . ao invés de vírgula ,
Nenhum comentário:
Postar um comentário