用js写一个双色球的生成器，大家都知道，双色球的规则是
- 红球6个，1-33中生成
- 篮球1个，1-16中生成
- 双色球号码从小到大的顺序输出，且无重复数字
- 不足两位的号码高位补0
思路
- [ 红色球：从1-33个数字中随机取出一个数，然后和已取出的其他数据进行比较，如果存在此数，则从新选取；]
- [ 蓝色球：从1-16中随机取出一个数位蓝色球]
- 蓝球数字有可能跟红色球一样
- 所以 写了一个生成六位不重复的数组
css部分
<style>
.box span {
display: inline-block;
width: 40px;
height: 40px;
border-radius: 50%;
border: solid 2px red;
color: #fff;
background: red;
font-size: 30px;
font-weight: 800;
text-align: center;
margin: 5px 10px;
}
.box span:last-child {
border: solid 2px blue;
color: #fff;
background: blue;
}
button {
background: blue;
}
</style>
HTML
<body>
<div class="box"></div>
<button id="start">开始</button>
<button id="end">结束</button>
</body>
JS部分
<script>
//获取节点
var box = document.querySelector('.box') //获取大盒子(放双色球号码)
var start = document.querySelector('#start') //获取开始按钮
var end = document.querySelector('#end'); //获取停止按钮
//获取6位随机数 不重复
function getNums(n, m) {
return Math.floor(Math.random() * (m - n + 1) + n)
}
getball()
//封装获取双色球的函数
function getball() {
box.innerHTML = ''
// 获取红球
var redball = []
while (redball.length < 6) { //用while去循环遍历新创建的redball数组；while循环的功能是—先判断，再循环；
var num = getNums(1, 32)
num < 10 ? num = '0' + num : num + num; //不满十 加0
if (redball.indexOf(num) == -1) { //去除数组重复，indexOf()的功能是，在数组中找不见这一项，就返回 -1；
redball.push(num) //只要数组中没有当前随机出来的数，我们就把它推（push)进我们创建的新数组
}
}
redball.sort(function (a, b) { //红色球排序
return a - b
})
var blueball = getNums(1, 16); //获取篮球
blueball < 10 ? blueball = '0' + blueball : blueball + blueball; //不满十 加0
var newarr = redball.concat(blueball)
for (var i in newarr) {
var span = document.createElement('span')
var text = document.createTextNode(newarr[i])
span.appendChild(text)
box.appendChild(span)
}
}
var timer = null //创建一个空的名字，去接收计时器
//点击开始
start.onclick = function () { //开始键的点击事件
timer = setInterval(function () { //计时器
getball()
}, 100)
start.disabled = true // 点击开始之后，禁用开始键，使其不能点击
}
//点击结束
end.onclick = function () { // 停止键的点击事件
clearInterval(timer) // 清楚定时器
timer = null
start.disabled = false // 点击停止键之后，让开始键解禁
}
</script>
最后祝大家都可以中他个一等奖
