本文實例為大家分享了js實現(xiàn)簡單隨機點名器的具體代碼,供大家參考,具體內(nèi)容如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .box { width: 200px; height: 200px; line-height: 200px; background-color: #ccc; font-size: 30px; text-align: center; } </style> </head> <body> <div class="box">此乃點名器</div> <input type="button" value="點名" id="btn"> <!-- <button id="btn">點名</button> --> <script> var btn = document.getElementById("btn"); var box = document.getElementsByClassName("box")[0]; // 3、寫一個隨機抽名的案例?(點擊按鈕開啟定時器, // 定時器中去隨機抽取人名,把全班的人放在一個數(shù)組中,只要想辦法獲取隨機的索引號就可以) btn.onclick = function() { if(this.value==="點名") { function fn() { var arr = ["張三","李四","王五","趙六","黑七","白八","紫九","紅薯"]; var index = parseInt(Math.random()*arr.length); var n1 = parseInt(Math.random()*255+1); var n2 = parseInt(Math.random()*255+1); var n3 = parseInt(Math.random()*255+1); box.style.background ="rgb("+n1+","+n2+","+n3+")" ; box.innerHTML = arr[index]; } this.value = "停止"; //定時器不加var聲明,涉及到作用域問題 timer=setInterval(fn,2); }else { clearInterval(timer); this.value = "點名"; } } </script> </body> </html>
網(wǎng)頁名稱:js實現(xiàn)簡單的隨機點名器-創(chuàng)新互聯(lián)
網(wǎng)站網(wǎng)址:http://www.rwnh.cn/article38/dpepsp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供企業(yè)網(wǎng)站制作、建站公司、網(wǎng)站內(nèi)鏈、商城網(wǎng)站、軟件開發(fā)、響應(yīng)式網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容