JavaScript利用Math随机数,实现一个猜拳小游戏, 5
利用Math随机数,实现一个猜拳小游戏,效果如图:提示:通过document.querySelector("input").value;获得文本框中的值。通过Math.f...
利用Math随机数,实现一个猜拳小游戏,效果如图: 提示: 通过document.querySelector("input").value;获得文本框中的值。 通过Math.floor(Math.random()*3)+1;获得1-3的随机数
展开
2个回答
展开全部
请输入你的出拳数字<input /><br />
<button>比赛</button>
<div></div>
<script>
window.onload=function(){
document.querySelector("button").onclick=function(){
var m=document.querySelector("div");
var x1=Number(document.querySelector("input").value);
if(x1<1||x1>3){
m.innerHTML="你输入的数字有误,只能是1、2、3";
}else{
var x2=Math.floor(Math.random()*3)+1;
m.innerHTML="结果:";
if(x1==x2){
m.innerHTML+="打平了";
}else if((x2-x1)==1||(x1-x2)==2){
m.innerHTML+="你赢了";
}else{
m.innerHTML+="你输了";
}
m.innerHTML+="<br />你出拳:"+x1+"<br />电脑出拳:"+x2;
}
}
}
</script>
展开全部
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="Keywords" content="alex,猜拳小游戏,do while,switch">
<meta name="Description" content="">
<meta name="Author" content="alex">
<title>简单猜拳小游戏</title>
<style type="text/css">
*{margin:0;padding:0}
html,body{
width:100%;
height:100%;
color:#f60;
font-family:"Microsoft Yahei";
font-weight:bold;
font-size:20px;
}
.content{
width:300px;
height:250px;
margin:100px auto;
background:#669933;
border-radius:8px;
line-height:170px;
}
#box1{
width:300px;
height:30px;
text-align:center;
}
#box2{
width:300px;
height:30px;
text-align:center;
}
#box3{
width:300px;
height:30px;
text-align:center;
}
</style>
</head>
<body>
<div class="content">
<div id="box1"></div>
<div id="box2"></div>
<div id="box3"></div>
</div>
<script type="text/javascript">
var user;
var computer;
var res;
var oBox1 = document.getElementById('box1');
var oBox2 = document.getElementById('box2');
var oBox3 = document.getElementById('box3');
do
{
user = parseInt( window.prom
<html>
<head>
<meta charset="utf-8">
<meta name="Keywords" content="alex,猜拳小游戏,do while,switch">
<meta name="Description" content="">
<meta name="Author" content="alex">
<title>简单猜拳小游戏</title>
<style type="text/css">
*{margin:0;padding:0}
html,body{
width:100%;
height:100%;
color:#f60;
font-family:"Microsoft Yahei";
font-weight:bold;
font-size:20px;
}
.content{
width:300px;
height:250px;
margin:100px auto;
background:#669933;
border-radius:8px;
line-height:170px;
}
#box1{
width:300px;
height:30px;
text-align:center;
}
#box2{
width:300px;
height:30px;
text-align:center;
}
#box3{
width:300px;
height:30px;
text-align:center;
}
</style>
</head>
<body>
<div class="content">
<div id="box1"></div>
<div id="box2"></div>
<div id="box3"></div>
</div>
<script type="text/javascript">
var user;
var computer;
var res;
var oBox1 = document.getElementById('box1');
var oBox2 = document.getElementById('box2');
var oBox3 = document.getElementById('box3');
do
{
user = parseInt( window.prom
追问
没发完呢
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询