js模拟双色球

js模拟双色球开奖,学习阶段,若有不正确的地方还望指正。话不多说,直接放代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>js双色球开奖</title>
		<style>
			/*css样式*/
			div{
				width: 60px;
				height: 60px;
				color: white;
				display: inline-block;
				margin-left: 15px;
				border-radius: 50px;
				text-align: center;
				line-height: 60px;
				font-size: x-large;
			}
			.red{
				background-color: red;
			}
			.blue{
				background-color: blue;
				margin-left: 35px;
			}
		</style>
		<script>
			onload = function(){
				//1.获取篮球对象
				blue = document.getElementsByClassName("blue")[0];
				//生成蓝色球随机数 1-16
				blue.innerText = parseInt(Math.random()*16+1);
				//2.生成红球1-33
				//定义数组
				lists =[];
				//将生成的随机数赋值给数组
				for(i=0;i<6;i++){
					lists[i] = parseInt(Math.random()*33+1);
				}
				//去重
				for(i=0;i<lists.length;i++){
					//内层循环对比
					for (j=0;j<i;j++){
						//判断
						if(lists[i]==lists[j]){
							//相等重新生成
							lists[i]=parseInt(Math.random()*33+1);
							//回退
							i--
						}
					}
				}
				//document.write(lists)
				red = document.getElementsByClassName("red");
				for(k=0;k<red.length;k++){
					red[k].innerText=lists[k];
				}
			}
		</script>
	</head>
	<body>
		<!--红球-->
		<div class="red"></div>
		<div class="red"></div>
		<div class="red"></div>
		<div class="red"></div>
		<div class="red"></div>
		<div class="red"></div>
		<!--篮球-->
		<div class="blue"></div>
	</body>
</html>

结果如下:
在这里插入图片描述

  • 3
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值