JavaScript if/else 语句参考

JavaScript if/else 语句

如果指定的条件为真，则if/else语句执行代码块。如果条件为假，则可以执行另一个代码块。if/else语句是JavaScript的“if”语句的一部分，用于根据不同的条件执行不同的操作。

在JavaScript中，我们有以下条件语句：

如果指定的条件为真，则使用if指定要执行的代码块
如果相同条件为false，则使用else指定要执行的代码块
如果第一个条件为false，则使用else if指定要测试的新条件

使用switch语句选择要执行的许多代码块之一

如果当前时间（HOUR）小于20:00，则在id=“demo”的元素中输出“Good day”：

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

尝试一下

浏览器支持

项	IE/Edge	Chrome	FireFox	Safari	Opera
语句
if/else	支持	支持	支持	支持	支持

语法

if语句指定如果一个条件为真时执行的代码块：

if (condition) { // 如果条件为真，则执行代码块 }

在else语句指定如果条件是假的要执行的代码块：

if (condition) {
  // 如果条件为真，则执行代码块
} else { 
  // 条件为false时要执行的代码块
}

else..if语句指定一个新的条件：第一条件是假的：

if (condition1) {
  // 如果condition1为true，则执行代码块
} else if (condition2) {
  // 如果condition1为false且condition2为true，则执行代码块
} else {
  // 如果condition1为false且condition2为false，则执行代码块
}

参数值

参数	描述
condition	必需的。一个计算结果为true或false的表达式

技术细节

项目	描述
JavaScript版本：	ECMAScript 1

更多例子

如果时间少于20:00，请创建“美好的一天”问候语，否则“晚上好”：

var time = new Date().getHours(); 
if (time < 20) {
  greeting = "美好的一天";
} else {
  greeting = "晚上好";
}

尝试一下

如果时间少于10:00，请创建一个“早上好”的问候语，如果没有，但时间少于20:00，请创建“美好的一天”问候语，否则为“晚上好”：

var time = new Date().getHours(); 
if (time < 10) {
  greeting = "早上好";
} else if (time < 20) {
  greeting = "美好的一天";
} else {
  greeting = "晚上好";
}

尝试一下

如果文档中的第一个<div>元素的id为“myDIV”，请更改其font-size：

var x = document.getElementsByTagName("DIV")[0];

if (x.id === "myDIV") { 
  x.style.fontSize = "30px";
}

尝试一下

如果用户单击图像，则更改<img>元素的源属性（src）的值：

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

尝试一下

根据用户输入显示消息：

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

尝试一下

验证输入数据：

var x, text;

// 获取id=“numb”的输入字段的值
x = document.getElementById("numb").value;

//如果x不是数字或小于1或大于10，则输出“输入无效”
//如果x是介于1和10之间的数字，则输出“输入正常”

if (isNaN(x) || x < 1 || x > 10) {
  text = "Input not valid";
} else {
  text = "Input OK";
}

尝试一下

JavaScript if/else 语句参考