if-else制御文の概要
条件によって実行されるプログラムコードを選択できる制御文です。
if(制御条件){処理A;}else{処理B;} の形式で記述します。
制御条件を満たす(truthy)場合は処理Aを実行し、制御条件を満たさない(falsy)なら処理Bを実行します。
実機サンプル
ボタンクリックすると結果を表示します
(ここに答えを表示)
サンプルコード
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset = "utf-8">
<title>YWORK : JavaScript : if-else ステートメント</title>
</head>
<body>
<p>ボタンで結果を表示します</p>
<form>
名前 : <input type="text" value="山田" id="idText1"><br>
性別 : <select size="1" id="idSelect1">
<option value="選択">選択</option>
<option value="男性">男性</option>
<option value="女性">女性</option>
</select><br>
ボタン<input type="button" value="ご挨拶" onclick="onClick1(idText1.value,idSelect1.value)"><br><!-- #1 -->
</form>
<p id="idAnswer">(ここに答えを表示)</p><!-- #elm -->
<script>
document.open();
let elmAnswer = document.getElementById("idAnswer"); //<!-- #elm -->
/***********************************************************************/
function onClick1(str1,str2){ //<!-- #1 -->
if(str2 == '選択'){
elmAnswer.innerHTML = '性別を選択して下さい';
}
else{
if(str2 == '男性'){
elmAnswer.innerHTML = str1+'くん こんにちは';
}
else{
elmAnswer.innerHTML = str1+'さん こんにちは';
}
}
}
/***********************************************************************/
document.close();
</script>
</body>
</html>
サンプルコードの要点
- if ステートメントは(入れ子)処理ができる
- 条件指定に比較演算子を使う [参照ページ ]
- else{処理}で条件不一致の場合の処理ができる