简单点名器案例

<div id="bigbox">
        <button id="btn">开始</button>
        <button id="btn1">结束</button>
        <div id="box"></div>
</div>
<style>
        #box{
            width: 200px;
            height: 100px;
            background-color: salmon;
            text-align: center;
        }
        #bigbox{
            width: 300px;
            height: 200px;
            margin: 0 auto;
        }
        #btn{
            width: 100px;
            height: 30px;
        }
        #btn1{
            width: 100px;
            height: 30px;
        }
</style>

<script>
        var  btn=document.getElementById('btn') 
        var  btn1=document.getElementById('btn1')
        var box=document.getElementById('box')


		//数组
        var arr=['小明','小王','小心','小刘','小佳',]   
        //设置全局  (方便用于清除定时器)
		var timer;
		//开始
        btn.onclick=function(){
			//清除定时器
          clearInterval(timer)
          timer=setInterval(function(){
                var i=Math.floor(Math.random()*(arr.length));
                box.innerHTML=arr[i]
            },10)
        }

        box.innerHTML=arr[0]
		
		//结束
        btn1.onclick=function(){
            clearInterval(timer);
        }
    </script>