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)容添加到頁面上 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>
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
支持多瀏覽器(IE、Firefox、Opera)剪切板復(fù)制函數(shù)_腳本之家修正版
有朋友要剪切板復(fù)制函數(shù),可網(wǎng)上的好多代碼都是不能運(yùn)行的,各種其它符號(hào),導(dǎo)致了腳本的不可運(yùn)行,腳本之家站長特整理了下,修正了錯(cuò)誤。2008-12-12詳解CocosCreator項(xiàng)目結(jié)構(gòu)機(jī)制
這篇文章主要介紹了詳解CocosCreator項(xiàng)目結(jié)構(gòu)機(jī)制,只有了解這些機(jī)制后,才能更好的進(jìn)行項(xiàng)目開發(fā),避免潛在錯(cuò)誤,并且快速的除錯(cuò)2021-04-04JavaScript和jquery獲取父級(jí)元素、子級(jí)元素、兄弟元素的方法
本文給大家簡單總結(jié)了下JavaScript和jquery獲取父級(jí)元素、子級(jí)元素、兄弟元素的方法,非常的簡單實(shí)用,有需要的小伙伴可以參考下2016-06-06基于HTML+CSS+JS實(shí)現(xiàn)紙牌記憶游戲
這篇文章主要介紹了如何利用HTML、CSS?和?JavaScript?制作紙牌記憶游戲,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起動(dòng)手嘗試一下2022-04-04JavaScript常用函數(shù)工具集:lao-utils
現(xiàn)在Javascript庫海量,流行的也多,比如jQuery,YUI等,雖然功能強(qiáng)大,但也是不萬能的,功能不可能涉及方方面面,這里給大家分享一個(gè)的JS庫是對(duì)這些的補(bǔ)充,很多也比較實(shí)用,把應(yīng)用到項(xiàng)目中中去也比較方面,這也是對(duì)工作的一些積累,也加深對(duì)知識(shí)的理解。2016-03-03JavaScript Title、alt提示(Tips)實(shí)現(xiàn)源碼解讀
我們知道給某些HTML標(biāo)簽加上title屬性后,這個(gè)標(biāo)簽對(duì)象在瀏覽的時(shí)候,鼠標(biāo)移上去就會(huì)有一個(gè)小提示框出來,并顯示title定義的內(nèi)容。2010-12-12