Easy Tutorial
❮ Prop Base Href Event Ontimeupdate ❯

JavaScript if/else Statement

JavaScript Statement Reference Manual

Example

If the current time (hour) is less than 20:00, output "Good day" on the element with id="demo":

var time = new Date().getHours(); if (time < 20) {
    document.getElementById("demo").innerHTML = "Good day";
}

Output result:

var d = new Date();
var time = d.getHours();
if (time < 20)
  {
  document.write("Good day");
  }

More examples are included at the bottom of this article.


Definition and Usage

The if/else statement executes a block of code if the specified condition is true. If the condition is false, another block of code can be executed.

The if/else statement is part of JavaScript's conditional statements, which are used to perform different actions based on different conditions.

In JavaScript, we can use the following conditional statements:


Browser Support

Statement Chrome Edge Firefox Safari Opera
if/else Yes Yes Yes Yes Yes

Syntax

if statement specifies a block of code to be executed if the condition is true:

else statement specifies a block of code to be executed if the condition is false:

else if statement specifies a new condition to test if the first condition is false:

Parameter Values

Parameter Description
condition Required. An expression used for condition evaluation: true or false

Technical Details

| JavaScript Version: | 1.0 | | --- | --- |


More Examples

Example

If the time is less than 20:00, generate a "Good day" greeting, otherwise output "Good evening":

var time = new Date().getHours(); if (time < 20) {
  greeting = "Good day";
}
else {
    greeting = "Good evening";
}

Greeting output result:

var d = new Date();
var time = d.getHours();
if (time < 20)
  {
  document.write("Good day");
  }
else
  {
  document.write("Good evening");
  }

Example

If the time is less than 10:00, output "Good morning" greeting, if the time is less than 20:00, output "Good day" greeting, otherwise output "Good evening":

var time = new Date().getHours(); if (time < 10) {
    greeting = "Good morning";
}
else if (time < 20) {
    greeting = "Good day";
}
else {
    greeting = "Good evening";
}

Greeting output result:

var d = new Date();
var time = d.getHours();
if (time < 10)
  {
  document.write("Good morning");
  }
else if (time < 20)
  {
  document.write("Good day");
  }
else
  {
  document.write("Good evening");
  }

Example

Modify the font size of the first <div> element with id equal to "myDIV":

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

Example

Change the src attribute of an <img> element when the user clicks on the 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>

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 x is less than 1 or greater than 10, output "Please enter a valid value"
// If x is between 1 and 10, output "Input correct"
if (isNaN(x) || x < 1 || x > 10) {
    text = "Please enter a valid value";
} else {
    text = "Input correct";
}
document.getElementById("demo").innerHTML = text;

Related Pages

JavaScript Tutorial: JavaScript If...Else Statement

JavaScript Tutorial: JavaScript Switch Statement


❮ Prop Base Href Event Ontimeupdate ❯