忍者ブログ

からすまる日誌 JavaScript

基本(9) 自習 サイコロの目をかく

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

基本(9) 自習 サイコロの目をかく

--->random02.html
 
<DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>random</title>
<link rel="stylesheet" href="random02.css">
</head>
<body>
<div id ="sai"></div>
<div id ="sai01">○○○</div>
<p>
<button onClick="saikoro()">start</button>
</p>
<p id="msg"></p>
<script src="random02.js"></script>
</body>
</html>
 

--->random02.js
 
//1-6のランダムな賽の目
var ran;//さいころの目
 
function saikoro(){
ran = Math.random() * 6 ;
ran = Math.floor(ran) + 1;
console.log(ran);
var sai = document.getElementById('sai');//さいの目を出す場所を事前に取得
var msg = document.getElementById('msg');//表示するメッセージ場所を事前に取得
var message;//表示するメッセージ内容
sai.innerHTML = ran;//ranの内容をsaiに反映
if(ran==6){
sai01.innerHTML = "●○●\n●○●\n●○●"
//sai02.innerHTML = "●○●"
//sai03.innerHTML = "●○●"
}else if(ran==5){
sai01.innerHTML = "●○●\n○●○\n●○●"
//sai02.innerHTML = "○●○"
//sai03.innerHTML = "●○●"
}else if(ran==4){
sai01.innerHTML = "●○●\n○○○\n●○●"
//sai02.innerHTML = "○○○"
//sai03.innerHTML = "●○●"
}else if(ran==3){
sai01.innerHTML = "○○●\n○●○\n●○○"
//sai02.innerHTML = "○●○"
//sai03.innerHTML = "○○●"
}else if(ran==2){
sai01.innerHTML = "○○●\n○○○\n●○○"
//sai02.innerHTML = "○○○"
//sai03.innerHTML = "○○●"
}else{
sai01.innerHTML = "○○○\n○●○\n○○○"
//sai02.innerHTML = "○●○"
//sai03.innerHTML = "○○○"
}
 
//6の時にはメッセージを書き出す
if(ran==6){
message ='おおあたり';
}else{
message='あなたのまけ';
}
msg.innerHTML = message;
}
PR

コメント

ただいまコメントを受けつけておりません。

ブログ内検索

P R