简单使用html+css+js随机获取一注双色球号码

最新推荐文章于 2024-04-13 23:28:01 发布

置顶键盘上行走的猿

最新推荐文章于 2024-04-13 23:28:01 发布

阅读量1.2w

点赞数 7

分类专栏：简单程序文章标签： HTML css JavaScript 前端实现选取双色球号码 html+css+js实现随机获取一注双色球号码

本文链接：https://blog.csdn.net/qq_45142260/article/details/102999648

版权

简单程序专栏收录该内容

2 篇文章 0 订阅

订阅专栏

随机抽取双色球号码

双色球规则：

双色球 投注区分为红色球号码区和蓝色球号码区，每注投注号码由6个红色球号码和1个蓝色球号码组成，红色球号码从1到33中选择，蓝色球号码从1到16中选择。
使用html+css+js实现随机抽取双色球一组号码

HTML代码:

<body>
		<input type="button" id="btn" value="选号" />
		<div class="wp" id="wp"></div>
	</body>

CSS代码:

<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			.wp{		
				text-align: center; 
			}
			/* 设置双色球的基本样式 */
			.wp span{
				display: inline-block;
				height: 50px;
				width: 50px;
				border-radius: 50%;
				border: 2px #F00 solid;
				margin: 25px 5px 0 5px;
				font-size: 20px;
				text-align: center;
				line-height: 50px;
				color: #333;
			}
			/* 第七个球的样式 */
			.wp span:nth-of-type(7n){
				border: 2px #0ff solid;
			}
			/* 设置按钮的基本样式 */
			#btn {              
				display: block;
				height: 50px;
				width: 100px;
				background: #FF0000;
				color: #fff;
				border-radius: 5px;
				border: 1px #333 solid;
				font-size: 20px;
				cursor: pointer;
				margin: 50px auto 0;
			}
		</style>

js代码：

<script type="text/javascript">
	
	var btn = document.getElementById("btn");   //获取button按钮属性
	var wp = document.getElementById("wp");      //获取wp属性
	btn.onclick = function(){                 //btn 点击执行内容
		var arr = [];                 //声明一个空数组
		for (var i=0;i<6;i++) {             //for 循环
			var a = Math.floor((Math.random()*33)+1);    //声明一个变量把1-33的随机数放进变量里面
			if (arr.indexOf(a)==-1){       //判断是否有重复的数字，如果有就放弃那个数字，重新随机获取一个随机数字，直到6个随机数没有重复值位置
				arr.push(a);
			}else {
				i -= 1;
				
			}
		}
		for(var n=0;n<arr.length;n++){            //把获取的6个随机数数组arr的值，分别写入wp内
			wp.innerHTML += '<span>'+arr[n]+'</span>';
		}
		wp.innerHTML += '<span>'+Math.floor((Math.random()*16)+1)+'</span>';  //获取第七个蓝色球，1-16随机数		
		wp.innerHTML += '<br />';
		console.log(arr);
	};
</script>

运行结果：每点击一次，就会随机获取一注双色球号码
在这里插入图片描述

键盘上行走的猿

关注

7
点赞
踩
34

收藏

觉得还不错? 一键收藏
2
评论
简单使用html+css+js随机获取一注双色球号码

随机抽取一注双色球双色球规则：双色球投注区分为红色球号码区和蓝色球号码区，每注投注号码由6个红色球号码和1个蓝色球号码组成，红色球号码从1到33中选择，蓝色球号码从1到16中选择。使用html+css+js实现随机抽取双色球一组号码HTML代码:<body> <input type="button" id="btn" value="选号" /> <...
复制链接

扫一扫