Conditional statements are used to perform different actions based on different conditions.
Conditional statements
Usually when writing code, you always need to perform different actions for different decisions action. You can use conditional statements in your code to accomplish this task.
In JavaScript, we can use the following conditional statements:
if statement - Use this statement to execute code only when the specified condition is true
if...else statement - execute code when the condition is true, execute other code when the condition is false
if...else if. ...else statement - Use this statement to select one of multiple code blocks to execute
switch statement - Use this statement to select one of multiple code blocks to execute
If statement
This statement will execute the code only if the specified condition is true.
Syntax
if (condition)
{
Code executed when the condition is true
}
Note: Please use lowercase if. Using uppercase letters (IF) will generate a JavaScript error!
Example
When the time is less than 20:00, generate the greeting "Good day":
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p>如果时间早于 20:00，会获得问候 "Good day"。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x="";
var time=new Date().getHours();
if (time<20){
x="Good day";
}
document.getElementById("demo").innerHTML=x;
}
</script>
</body>
</html> Note , in this syntax, there is no ..else... You've told the browser to only execute the code if the specified condition is true.
Run the program and try it
If...else statement
Please use if... The .else statement executes code when the condition is true and other code when the condition is false.
Syntax
##if (condition) {
Code executed when the condition is true
}
else
{
Code executed when the condition is not true
}
Example
When the time is less than 20:00, the greeting "Good day" is generated, otherwise the greeting "Good evening" is generated.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p>点击这个按钮，获得基于时间的问候。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x="";
var time=new Date().getHours();
if (time<20){
x="Good day";
}
else{
x="Good evening";
}
document.getElementById("demo").innerHTML=x;
}
</script>
</body>
</html>Run the program and try it
If...else if...else statement
Use if....else if...else statement to select one of multiple blocks of code to execute.
Syntax
if (condition1) {
Code executed when condition 1 is true
}
else if (condition2)
{
Code executed when condition 2 is true
}
else
{
When neither condition 1 nor condition 2 is true Code executed when true
}
Example
If the time is less than 10:00, the greeting "Good morning" is generated ", if the time is greater than 10:00 and less than 20:00, the greeting "Good day" is generated, otherwise the greeting "Good evening" is generated:
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<script type="text/javascript">
var d = new Date();
var time = d.getHours();
if (time<10)
{
document.write("<b>早上好</b>");
}
else if (time>=10 && time<16)
{
document.write("<b>今天好</b>");
}
else
{
document.write("<b>Hello World!</b>");
}
</script>
<p>
这个例子演示了 if..else if...else 语句。
</p>
</body>
</html>Run the program and try it
Next Section
