JavaScript si... sinon
Exemple
Si l'heure est inférieure à 20, sortie "Bonne journée":
let hour = new Date().getHours();
if (hour < 20) {
document.getElementById("demo").innerHTML = "Good day";
}
Sortie "Bonjour" ou "Bonsoir":
let hour = new Date().getHours();
if (hour < 20) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}
Plus d'exemples ci-dessous.
Définition et utilisation
L'instruction if/else exécute un bloc de code si une condition spécifiée est vraie. Si la condition est fausse, un autre bloc de code peut être exécuté.
L'instruction if/else fait partie des instructions "conditionnelles" de JavaScript, qui sont utilisées pour effectuer différentes actions en fonction de différentes conditions.
En JavaScript, nous avons les instructions conditionnelles suivantes :
- Utilisez if pour spécifier un bloc de code à exécuter, si une condition spécifiée est vraie
- Utilisez else pour spécifier un bloc de code à exécuter, si la même condition est fausse
- Utilisez else if pour spécifier une nouvelle condition à tester, si la première condition est fausse
- Utilisez le commutateur pour sélectionner l'un des nombreux blocs de code à exécuter
Syntaxe
L' instruction if spécifie un bloc de code à exécuter si une condition est vraie :
if (condition) {
// block of code to be executed if the condition is true
}
L' instruction else spécifie un bloc de code à exécuter si la condition est fausse :
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
}
L' instruction else if spécifie une nouvelle condition si la première condition est fausse :
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
}
Valeurs des paramètres
| Parameter | Description |
|---|---|
| condition | Required. An expression that evaluates to true or false |
Plus d'exemples
Si l'heure est inférieure à 10h00, créez un message d'accueil "Bonjour", sinon, mais l'heure est inférieure à 20h00, créez un message d'accueil "Bonjour", sinon un "Bonsoir":
var time = new Date().getHours();
if (time < 10) {
greeting = "Good morning";
}
else if (time < 20) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}
Si le premier élément <div> du document a pour identifiant "myDIV", modifiez sa taille de police :
var x = document.getElementsByTagName("DIV")[0];
if (x.id === "myDIV") {
x.style.fontSize = "30px";
}
Modifiez la valeur de l'attribut source (src) d'un élément <img>, si l'utilisateur clique sur l'image :
<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>
Afficher un message basé sur l'entrée de l'utilisateur :
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..";
}
Validez les données d'entrée :
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";
}
Pages connexes
Tutoriel JavaScript : Instructions JavaScript If...Else
Tutoriel JavaScript : Instruction JavaScript Switch
Prise en charge du navigateur
if...else est une fonctionnalité ECMAScript1 (ES1).
ES1 (JavaScript 1997) est entièrement pris en charge dans tous les navigateurs :
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |