TOPページ >  JavaScriptの演算および構文 > IF文を使って処理を条件分けする

IF文を使って処理を条件分けする

ホームページやブログなどのウェブサイトで JacaScript を使用して関数などを実行する際に、IF 文を使って 条件が真か偽かで場合分けをする方法をご紹介します。

ユーザーの作動や環境などによって処理を分けるのに便利です。ある程度複雑なスクリプトには欠かせない構文の一つです。

if (条件) 条件が真のときの処理 else 条件が偽のときの処理
  1. 条件:真偽を分けるための 条件文を記述します。
  2. 条件が真のときの処理:条件文が真のとき実行する内容を記述します。実行文が複数のときは、{}で括ると、ブロックとして括弧内の処理がすべて実行されます。
  3. 条件が偽のときの処理:条件が偽のとき実行する内容を記述します。条件文が偽のとき 何も事項させない場合は、else 以降は不要です。

サンプルです。

<SCRIPT LANGUAGE="JavaScript">
<!--
function color( color ) {
var objid = document.getElementById('colorText');
objid.style.color = color ;
if ( color == "red" ) { msg = "今の文字色は、赤色です。" ; }
if ( color == "blue" ) { msg = "今の文字色は、青色です。" ; }
if ( color == "green" ) { msg = "今の文字色は、緑色です。" ; }
objid.innerHTML = msg ;
}
//-->
</SCRIPT>

<input type="radio" name="sample" onClick=color('red')>赤
<input type="radio" name="sample" onClick=color('blue') >青
<input type="radio" name="sample" onClick=color('green') >緑
<div id="colorText">
ラジオボタンをチェックしてください。文字と色が変化します。
</div>

このサンプルは、ラジオボタンのいずれかをクリックすると、 『 color 』という名前の関数を呼び出します。この関数では、色名称を引数として引き渡しており、引数ごとに IF 文で場合分けしています。

引数が『red』であれば、表示メッセージの変数『 msg 』に、"今の文字色は、赤色です。" という文字列を代入する、という具合です。

ラジオボタンをチェックしてください。文字と色が変化します。

ランキングに参加中です! お役に立てたらクリックをお願いします→

同一カテゴリ内一覧
WHILE文を使って条件が満たされるまで処理を繰り返す
FOR文を使って処理を繰り返す1
IF文を使って処理を条件分けする
JavaScript関数の基本
演算子の優先順位
ビット演算子を使って計算をする
代入演算子を使って計算をする
論理演算子を使って計算をする
比較演算子を使って計算をする
算術演算子を使って計算をする
IEの方はこちらから当サイト ブックマークできます。
ランキング参加中!お役に立てたら クリックをお願いします。
当サイト掲載カテゴリは
Yahoo! JAPAN コンピュータとインターネット > データ形式 > HTML > リファレンス