用js寫一個(gè)雙色球的生成器,大家都知道,雙色球的規(guī)則是
- 紅球6個(gè)狂巢,1-33中生成
- 籃球1個(gè),1-16中生成
- 雙色球號(hào)碼從小到大的順序輸出书聚,且無(wú)重復(fù)數(shù)字
- 不足兩位的號(hào)碼高位補(bǔ)0
思路
- [ 紅色球:從1-33個(gè)數(shù)字中隨機(jī)取出一個(gè)數(shù)唧领,然后和已取出的其他數(shù)據(jù)進(jìn)行比較,如果存在此數(shù)雌续,則從新選日陡觥;]
- [ 藍(lán)色球:從1-16中隨機(jī)取出一個(gè)數(shù)位藍(lán)色球]
- 藍(lán)球數(shù)字有可能跟紅色球一樣
- 所以 寫了一個(gè)生成六位不重復(fù)的數(shù)組
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">開(kāi)始</button>
<button id="end">結(jié)束</button>
</body>
JS部分
<script>
//獲取節(jié)點(diǎn)
var box = document.querySelector('.box') //獲取大盒子(放雙色球號(hào)碼)
var start = document.querySelector('#start') //獲取開(kāi)始按鈕
var end = document.querySelector('#end'); //獲取停止按鈕
//獲取6位隨機(jī)數(shù) 不重復(fù)
function getNums(n, m) {
return Math.floor(Math.random() * (m - n + 1) + n)
}
getball()
//封裝獲取雙色球的函數(shù)
function getball() {
box.innerHTML = ''
// 獲取紅球
var redball = []
while (redball.length < 6) { //用while去循環(huán)遍歷新創(chuàng)建的redball數(shù)組驯杜;while循環(huán)的功能是—先判斷受啥,再循環(huán);
var num = getNums(1, 32)
num < 10 ? num = '0' + num : num + num; //不滿十 加0
if (redball.indexOf(num) == -1) { //去除數(shù)組重復(fù),indexOf()的功能是滚局,在數(shù)組中找不見(jiàn)這一項(xiàng)叁温,就返回 -1;
redball.push(num) //只要數(shù)組中沒(méi)有當(dāng)前隨機(jī)出來(lái)的數(shù)核畴,我們就把它推(push)進(jìn)我們創(chuàng)建的新數(shù)組
}
}
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 //創(chuàng)建一個(gè)空的名字膝但,去接收計(jì)時(shí)器
//點(diǎn)擊開(kāi)始
start.onclick = function () { //開(kāi)始鍵的點(diǎn)擊事件
timer = setInterval(function () { //計(jì)時(shí)器
getball()
}, 100)
start.disabled = true // 點(diǎn)擊開(kāi)始之后,禁用開(kāi)始鍵谤草,使其不能點(diǎn)擊
}
//點(diǎn)擊結(jié)束
end.onclick = function () { // 停止鍵的點(diǎn)擊事件
clearInterval(timer) // 清楚定時(shí)器
timer = null
start.disabled = false // 點(diǎn)擊停止鍵之后跟束,讓開(kāi)始鍵解禁
}
</script>
最后祝大家都可以中他個(gè)一等獎(jiǎng)