Math-メソッドの使用 - Webデザインを学ぶ

randomをつかっておみくじをつくる。

<head>
<script>
function uranau(){
var rdm = Math.random();
if( rdm<0.25){
	document.write('<h1>大吉</h1>');
}else if(rdm<0.5){
  document.write('<h1>中吉</h1>');
}else if(rdm<0.75){
	document.write('<h1>小吉</h1>');
}else{
	document.write('<h1>凶</h1>');}
}
</script>
</head>
<body>
<h1>おみくじ</h1>
<p>下のボタンをクリックするとあなたの運勢を占えます。</p>
<p><button onclick="uranau()">占う</button></p>
</body>

↓占うボタンを押すごとに大吉、中吉、小吉、凶がランダムで出てきます。
f:id:hourin-g0913:20160315135820p:plain

randomとfloorを使って画像の表示

<head>
<meta charset="utf-8">
<title>画像のランダム表示</title>
<style>

</style>
</head>

<body>
<h1>今日のイメージ</h1>
<script>
var numOfImg = 5;
var rdm = Math.floor(Math.random()*numOfImg + 1);
document.write('<img src ="img/0'+ rdm +'.jpg" alt="">');
</script>
</body>

↓ページを更新する度に、5枚の画像の中からランダムで選ばれた画像を表示します。
f:id:hourin-g0913:20160315140109p:plain