赤字:JavaScriptの命令や重要なタグ/青字:用途に応じて変更する部分/緑字:変更可能な変数名やユーザー関数名
<form><input type="button" value="おみくじ" onClick="omikuji()"></form>
<script type="text/javascript"> function omikuji() { rand = Math.floor(Math.random()*5); if (rand == 0) msg = "大吉"; if (rand == 1) msg = "中吉"; if (rand == 2) msg = "吉"; if (rand == 3) msg = "凶"; if (rand == 4) msg = "大凶"; alert(msg); } </script>
ボタンを押すと、乱数が決定され、0~4番までの文章の1つが表示されます。
ボタン無しで、HTMLの表示と同時にメッセージを表示する場合は以下のようになります。
<script type="text/javascript"> rand = Math.floor(Math.random()*5); if (rand == 0) msg = "大吉"; if (rand == 1) msg = "中吉"; if (rand == 2) msg = "吉"; if (rand == 3) msg = "凶"; if (rand == 4) msg = "大凶"; document.write(msg); </script>
メッセージを組み合わせて自由に作成してくれるものも簡単に作成できます。
下記リンクをクリックすると新しいウインドウでサンプルが実行されます。再読込をするとメッセージが変わります。詳細はInstantJoker.htmlのソースを表示してください。
サンプル:InstantJoker.html
<form><input type="button" value="おみくじ" onClick="omikuji()"></form> <script type="text/javascript"> function omikuji() { rand = Math.floor(Math.random()*100); msg = "大吉"; //0~9(10%) if (rand > 9) msg = "中吉"; //10~29(20%) if (rand > 29) msg = "吉"; //30~69(40%) if (rand > 69) msg = "凶"; //70~89(20%) if (rand > 89) msg = "大凶"; //90~99(10%) alert(msg); } </script>
ボタンを押すと、乱数が決定され、更に条件文で乱数の受け取る範囲をそれぞれに作って文章を決めています。
条件文は上から徐々に範囲を絞っています。
乱数が10ならmsg変数はまず「大吉」になり、次に「中吉」になり、以後の条件には外れますので、最終的に「中吉」となります。
乱数が90の場合、すべての条件に当てはまって行きますが、最終的には「大凶」となります。
結果として、条件文を並べることで、条件を絞って行くことになり、それぞれに乱数を取る範囲ができあがり、これによって各条件の確率が異なる結果になっています。