js實現(xiàn)隨機點名
更新時間：2021年01月19日 08:28:41 作者：搬磚大法
這篇文章主要為大家詳細介紹了js實現(xiàn)隨機點名，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了js實現(xiàn)隨機點名的具體代碼，供大家參考，具體內容如下
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div:nth-child(1) {
width: 200px;
height: 100px;
background-color: burlywood;
text-align: center;
line-height: 100px;
}
div:nth-child(2) {
width: 100px;
height: 100px;
background-color: pink;
border-radius: 50%;
text-align: center;
line-height: 100px;
}
</style>
</head>
<body>
<div>劉志遠</div>
<div>開始</div>
<script>
var div = document.getElementsByTagName('div');
var btn = document.getElementsByTagName('button')[0];
username()
function username() {
var flag = false;
var timerId = null;
// console.log(div);
var arr = ['劉志遠', '萬策', '李博文', '曹建瑩', '張佳祺', '趙瑞瑞', '陳全虎', '胡金朋', '耿建麗', '王如雪', '王振濤', '劉放', '張亞迪', '朱翔煜', '王奧', '薛澳飛', '劉志瑋', '胡高洋', '周暢', '趙英杰', '徐亞美', '鄭勇超', '聞吉祥', '王阿雨', '陳德帥', '申林益', '趙艷哲', ' 肖夢飛', '鮑爾欣', '代星澳', '汪青', '謝森成', '雷呂能', '丁康寧', '楊澤文', '王永杰', '侯振強', '馬建成', '朱保森', '王皓圓', '孫秀婷', '靳丹丹', '李聰', '紀妍', '蘇文璇'];
div[1].onclick = function() {
if (flag) {
clearInterval(timerId);
div[1].innerHTML = '停止'
flag = false;
} else {
timerId = setInterval(function() {
var re = Math.floor(Math.random() * arr.length);
console.log(re);
div[0].innerHTML = arr[re];
}, 60);
div[1].innerHTML = '開始'
flag = true;
}
}
}
</script>
</body>
</html>
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
本文主要介紹了微信小程序骨架屏的實現(xiàn)示例，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
這篇文章主要介紹了Javascript調用函數(shù)方法的幾種方式介紹,本文講解了func()、(function(arg){})(window)、func.bind(sth)()、func.call()、func.apply()等5種方式,需要的朋友可以參考下2015-03-03
js拖拽是常見的網頁效果,本文將從零開始實現(xiàn)一個簡單的js插件,下面和小編來一起學習一下吧2019-05-05
上傳圖片時候遇到要上傳很大的圖片,上傳的時候就會很慢,所以需要對圖片進行壓縮處理來優(yōu)化上傳功能,這篇文章主要給大家介紹了關于如何使用JavaScript對圖像進行壓縮的相關資料,需要的朋友可以參考下2024-03-03
有些小伙伴可能會問caller,callee 是什么?在javascript 中有什么樣的作用?那么本篇會對于此做一些基本介紹。希望能夠對大家理解javascript中的callee與caller有所幫助。2015-08-08
這篇文章主要為大家詳細介紹了使用zepto.js，純JS寫的登錄界面，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10
JS實現(xiàn)表單驗證功能(驗證手機號是否存在，驗證碼倒計時)
js實現(xiàn)表單驗證功能，通過js代碼驗證手機號是否存在驗證碼倒計時功能，代碼簡單易懂非常不錯，具有參考借鑒價值，感興趣的朋友一起看看吧2016-10-10
微信小程序的存在許多功能上的限制和約束,有些情況不得不去使用webview進行開發(fā)實現(xiàn)需求,這篇文章主要給大家介紹了關于微信小程序webview和小程序通訊實際操作的相關資料,需要的朋友可以參考下2024-07-07
這篇文章主要介紹了js實現(xiàn)從右向左緩緩浮出網頁浮動層廣告的方法,可實現(xiàn)右側浮動廣告的定時彈出及點擊展開、折疊等功能,非常具有實用價值,需要的朋友可以參考下2015-05-05
在js里怎么實現(xiàn)Xcode里的callFuncN方法(詳解)
下面小編就為大家?guī)硪黄趈s里怎么實現(xiàn)Xcode里的callFuncN方法(詳解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-11-11