JavaScript if/else 語句

JavaScript 語句參考手冊 JavaScript 語句參考手冊

實例

如果當前時間(小時)小於 20:00, 在 id="demo" 元素上輸出 "Good day" :

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

輸出結果：


本文底部包含更多實例。

定義和用法

if/else 語句在指定的條件為 true 時，執行代碼塊。如果條件為 false，會執行另外一個代碼塊。

if/else 語句是 JavaScript 條件語句的一部分, 條件語句用於基於不同的條件來執行不同的動作。

在 JavaScript 中，我們可使用以下條件語句：

  • if 語句 - 只有當指定條件為 true 時，使用該語句來執行代碼。
  • else 語句 如果 if 語句的條件為false，則執行該代碼塊
  • else if 語句 - 檢測一個新的條件，如果第一個條件為false
  • switch 語句 - 選擇多個代碼塊中其中一個執行

流覽器支持

語句
if/else Yes Yes Yes Yes Yes

語法

if 語句指定了在條件為 true 時執行的代碼塊：

if (condition) {
    如果 condition 為 true 執行該代碼塊
}

else 語句指定在條件為 false 時執行的代碼塊：

if (condition) {
    如果 condition 為 true 執行該代碼塊
} else {
    如果 condition 為 false 執行該代碼塊
}

else if 語句在第一個條件為false時指定了新的條件:

if (condition1) {
    如果 condition1 為 true 執行該代碼塊
} else if (condition2) {
    如果 condition1 為 false 且 condition2 為 true 執行該代碼塊
} else {
    如果 condition1 為 false 且 condition2 為 false 執行該代碼塊
}

參數值

參數 描述
condition 必須。運算式，用於條件判斷： true 或 false

技術細節

JavaScript 版本： 1.0

實例

更多實例

實例

如果時間小於 20:00, 生成一個 "Good day" 問候，否則輸出 "Good evening":

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

問候語的輸出結果為：

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


實例

如果時間小於 10:00, 輸出 "Good morning" 問候語，如果時間小於 20:00, 輸出 "Good day" 問候語, 否則輸出 "Good evening":

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

問候語輸出結果為:

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


實例

修改文檔中第一個 id 等於 "myDIV" 的 <div> 元素的字體號:

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 x, text;

// 獲取 id="numb" 輸入框的值

x = document.getElementById("numb").value;

// 如果 x 不是換一個數字或 x 小於 1 或大於10 輸出 "請輸入合法值"
// 如果 x 的值介於 1 和 10 之間，輸出 "輸入正確"

if (isNaN(x) || x < 1 || x > 10) {
text = "請輸入合法值";
} else {
    text = "輸入正確";
}
document.getElementById("demo").innerHTML = text;


相關頁面

JavaScript 教學: JavaScript If...Else 語句

JavaScript 教學: JavaScript Switch 語句

JavaScript 語句參考手冊 JavaScript 語句參考手冊