Istruzione if/else in JavaScript

Definizione e uso

L'istruzione if/else esegue un blocco di codice quando la condizione specificata è vera. Se la condizione è falsa, è possibile eseguire un altro blocco di codice.

L'istruzione if/else fa parte delle istruzioni "condizionali" di JavaScript e viene utilizzata per eseguire diverse operazioni in base a diverse condizioni.

In JavaScript, abbiamo le seguenti istruzioni condizionali:

  • Usa if per specificare il blocco di codice da eseguire se la condizione è vera
  • Usa else per specificare il blocco di codice da eseguire se la condizione è falsa
  • Se la prima condizione è falsa, usa else if per specificare una nuova condizione da testare
  • Usa switch per selezionare uno dei vari blocchi di codice da eseguire

Example

Se l'ora corrente (HOUR) è minore di 20:00, visualizza "Buongiorno" nell'elemento con id="demo":

var time = new Date().getHours(); 
se (time < 20) {
  document.getElementById("demo").innerHTML = "Buongiorno";
}

亲自试一试

Più esempi TIY sono disponibili nella parte inferiore della pagina.

Sintassi

L'istruzione if specifica il blocco di codice da eseguire quando la condizione è vera:

se (condition) {
  // blocco di codice da eseguire se la condizione è vera
}

L'istruzione else specifica il blocco di codice da eseguire se la condizione è falsa:

se (condition) {
  // blocco di codice da eseguire se la condizione è vera
} else { 
  // blocco di codice da eseguire se la condizione è falsa
}

Se la prima condizione è falsa, l'istruzione else if specifica una nuova condizione:

se (condition1) {
  // blocco di codice da eseguire se condition1 è vero
} altrimenti se (condition2) {
  // blocco di codice da eseguire se condition1 è falso e condition2 è vero
} else {
  // blocco di codice da eseguire se condition1 è falso e condition2 è falso
}

Valore del parametro

Parametro Descrizione
condition Obbligatorio. Espressione che restituisce true o false.

Dettagli tecnici

Versione JavaScript: ECMAScript 1

Più esempi

Example

Se l'ora è minore di 20:00, crea un saluto "Buon giorno", altrimenti crea un saluto "Buona sera":

var time = new Date().getHours(); 
se (time < 20) {
  greeting = "Buongiorno";
} else {
  greeting = "Buona sera";
}

亲自试一试

Example

Se l'ora è minore di 10:00, crea un saluto "Buon giorno", altrimenti se minore di 20:00, crea un saluto "Buon giorno", altrimenti crea un saluto "Buona sera":

var time = new Date().getHours(); 
se (time < 10) {
  greeting = "Buon giorno";
} altrimenti se (time < 20) {
  greeting = "Buongiorno";
} else {
  greeting = "Buona sera";
}

亲自试一试

Example

Se l'elemento <div> primo del documento ha l'id "myDIV", cambia la dimensione del carattere:

var x = document.getElementsByTagName("DIV")[0];
if (x.id === "myDIV") {}} 
  x.style.fontSize = "30px";
}

亲自试一试

Example

When the user clicks the image, change the value of the source attribute (src) of the <img> element:

<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>

亲自试一试

Example

Display messages based on user input:

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 it is other letters
} else {
  text = "Waaay off..";
}

亲自试一试

Example

Validate input data:

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";
}

亲自试一试

browser support

语句 Chrome IE Firefox Safari Opera
if/else Supporto Supporto Supporto Supporto Supporto

Pagine correlate

Lezione JavaScript:Esercizio di If...Else JavaScript

Lezione JavaScript:Esercizio di Switch JavaScript