JavaScript se... senão
Exemplo
Se a hora for inferior a 20, imprima "Bom dia":
let hour = new Date().getHours();
if (hour < 20) {
document.getElementById("demo").innerHTML = "Good day";
}
Saída "Bom dia" ou "Boa noite":
let hour = new Date().getHours();
if (hour < 20) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}
Mais exemplos abaixo.
Definição e uso
A instrução if/else executa um bloco de código se uma condição especificada for verdadeira. Se a condição for falsa, outro bloco de código pode ser executado.
A instrução if/else faz parte das Declarações "Condicionais" do JavaScript, que são usadas para executar diferentes ações com base em diferentes condições.
Em JavaScript temos as seguintes declarações condicionais:
- Use if para especificar um bloco de código a ser executado, se uma condição especificada for verdadeira
- Use else para especificar um bloco de código a ser executado, se a mesma condição for falsa
- Use else if para especificar uma nova condição a ser testada, se a primeira condição for falsa
- Use switch para selecionar um dos muitos blocos de código a serem executados
Sintaxe
A instrução if especifica um bloco de código a ser executado se uma condição for verdadeira:
if (condition) {
// block of code to be executed if the condition is true
}
A instrução else especifica um bloco de código a ser executado se a condição for falsa:
if (condition) {
// block of code to be executed if the condition is true
}
else {
// block of code to be executed if the condition is false
}
A instrução else if especifica uma nova condição se a primeira condição for falsa:
if (condition1) {
// block of code to be executed if condition1 is true
}
else if (condition2) {
// block of code to be executed if the condition1 is false and condition2 is true
} else {
// block of code to be executed if the condition1 is false and condition2 is false
}
Valores de parâmetro
| Parameter | Description |
|---|---|
| condition | Required. An expression that evaluates to true or false |
Mais exemplos
Se a hora for menor que 10:00, crie uma saudação "Bom dia", se não, mas a hora for menor que 20:00, crie uma saudação "Bom dia", caso contrário, uma "Boa noite":
var time = new Date().getHours();
if (time < 10) {
greeting = "Good morning";
}
else if (time < 20) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}
Se o primeiro elemento <div> no documento tiver um id de "myDIV", altere o tamanho da fonte:
var x = document.getElementsByTagName("DIV")[0];
if (x.id === "myDIV") {
x.style.fontSize = "30px";
}
Altere o valor do atributo source (src) de um elemento <img>, caso o usuário clique na imagem:
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<script>
function changeImage() {
var image = document.getElementById("myImage");
if (image.src.match("bulbon")) {
image.src = "pic_bulboff.gif";
} else {
image.src = "pic_bulbon.gif";
}
}
</script>
Exiba uma mensagem com base na entrada do usuário:
var letter = document.getElementById("myInput").value;
var text;
// If the letter is "c"
if (letter === "c") {
text = "Spot on! Good job!";
// If the letter is "b" or "d"
} else if (letter === "b" || letter === "d") {
text = "Close, but not close enough.";
// If the letter is anything else
} else {
text = "Waaay off..";
}
Valide os dados de entrada:
var x, text;
// Get the value of the input field with id="numb"
x = document.getElementById("numb").value;
// If x is Not a Number or less than 1 or greater than 10, output "input is not valid"
// If x is a number between 1 and 10, output "Input OK"
if (isNaN(x) || x < 1 || x > 10) {
text = "Input not valid";
} else {
text = "Input OK";
}
Páginas relacionadas
Tutorial JavaScript: Instruções JavaScript If...Else
Tutorial JavaScript: Instrução de troca de JavaScript
Suporte ao navegador
if...else é um recurso ECMAScript1 (ES1).
ES1 (JavaScript 1997) é totalmente suportado em todos os navegadores:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |