js實(shí)現(xiàn)雙色球效果
本文實(shí)例為大家分享了js實(shí)現(xiàn)雙色球效果的具體代碼,供大家參考,具體內(nèi)容如下
效果展示:

源碼展示:
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>js實(shí)現(xiàn)雙色球效果</title> <style> span{ font-size: 20px; } .a { color: red; } .b { color: blue; } </style></head><body><button>點(diǎn)擊獲取今日雙色球數(shù)</button><pre> <span class='a'></span><span class='b'></span></pre> <script> var arrS = []; for (let i = 1; i < 34; i++) { arrS[i - 1] = i; } var spans = document.querySelectorAll('span'); document.querySelector('button').onclick = function () { /*es6 使用 set 集合會(huì)自動(dòng)去除重復(fù)*/ /*獲取紅球*/ let set = new Set(); while (set.size < 6) { set.add(getR(arrS, arrS.length)); } /*獲取籃球*/ let set1 = new Set(); while (set1.size < 1) { set1.add(getR(arrS, 16)); } var hong = ''; var lan = ''; for (let v of set) { hong += v; hong += ' '; } for (let v of set1) { lan += v; lan += ' '; } //將內(nèi)容添加到頁(yè)面上 spans[0].innerText = hong; spans[1].innerText = lan; } // 獲取指定范圍內(nèi)的隨機(jī)數(shù) function getR(arr, al) { return arr[Math.floor(Math.random() * al)]; }</script></body></html>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. ASP新手必備的基礎(chǔ)知識(shí)2. asp文件用什么軟件編輯3. CentOS郵箱服務(wù)器搭建系列——SMTP服務(wù)器的構(gòu)建( Postfix )4. PHP基礎(chǔ)之生成器4——比較生成器和迭代器對(duì)象5. JAVA 實(shí)現(xiàn)延遲隊(duì)列的方法6. JS中6個(gè)對(duì)象數(shù)組去重的方法7. vue+element開發(fā)一個(gè)谷歌插件的全過程8. Vue axios獲取token臨時(shí)令牌封裝案例9. 通過IEAD+Maven快速搭建SSM項(xiàng)目的過程(Spring + Spring MVC + Mybatis)10. 利用CSS制作3D動(dòng)畫

網(wǎng)公網(wǎng)安備