JavaScript if/else文
例
現在の時刻(時)が 20:00 より前の場合、id="demo" の要素に "Good day" を出力します:
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文- 複数のコードブロックの中から1つを選択して実行します。
ブラウザサポート
| 文 | |||||
|---|---|---|---|---|---|
| if/else | Yes | Yes | Yes | Yes | Yes |
構文
if文は、条件が true の場合に実行されるコードブロックを指定します:
condition が true の場合、このコードブロックを実行します
}
else文は、条件が false の場合に実行されるコードブロックを指定します:
condition が true の場合、このコードブロックを実行します
} else {
condition が false の場合、このコードブロックを実行します
}
else if文は、最初の条件が false の場合に新しい条件を指定します:
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" を出力します:
if (time < 20) {
greeting = "Good day";
} else {
greeting = "Good evening";
}
挨拶の出力結果は次のとおりです:
試してみる »
例
時刻が 10:00 より前の場合、"Good morning" の挨拶を出力し、時刻が 20:00 より前の場合、"Good day" の挨拶を出力し、それ以外の場合は "Good evening" を出力します:
if (time < 10) {
greeting = "Good morning";
} else if (time < 20) {
greeting = "Good day";
} else {
greeting = "Good evening";
}
挨拶の出力結果は次のとおりです:
試してみる »
例
ドキュメント内で最初に id が "myDIV" の <div> 要素のフォントサイズを変更します:
if (x.id == "myDIV") {
x.style.fontSize = "30px";
}
試してみる »
例
ユーザーが画像をクリックしたときに <img> 要素の src 属性を変更します:
<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>
試してみる »
例
入力データを検証します:
// 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 文リファレンス その他の拡張