random関数 - web-0127のブログ

乱数の発生

「random()」は、「0以上１未満の乱数を生成する」メソッド
「floor()」は、「小数点以下を切り捨てる」メソッド

ランダムな「整数」を生成する

rnd = Math.floor(Math.random() * (MAX + 1));

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>乱数の発生</title>
</head>
<body>
<h1>乱数の発生</h1>
<script>
MAX = 10;
var num;
for (var i=0; i < 10; i++) {
  num = Math.floor(Math.random() * (MAX + 1));
  document.write(num, "<br>");
}
</script>
</body>
</html>

画像のランダム表示

「img0〜img4」画像を準備する
「img1〜」の場合は、((Math.random()*numOfImg)+1)となる

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>イメージをランダムに表示する</title>
<style>
body {;
	text-align: center;
}
</style>
</head>
<body>
<h1>今日のイメージ</h1>
<script>
numOfImg = 4;
var num;
num = Math.floor(Math.random() * numOfImg)
document.write('<img src="img/img' + num + '.jpg">');
</script>
</body>
</html>

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>おみくじ</title>
<style>
body {
	background: url(img/omikuji.gif) ;
}
</style>
</head>
<body>
<h1>あなたの今日の運勢</h1>
<script>
//配列imagesにイメージファイルのパスを入れておく
var images = new Array(4);
images[0] = "0.jpg";
images[1] = "1.jpg";
images[2] = "2.jpg";
images[3] = "3.jpg";

num = Math.floor(Math.random() * 4);
document.write('<p><img src="img/');
document.write(images[num]);
document.write('"></p>');
</script>
</body>
</html>