中奖点名器```HTML 恭喜：0 开始停止 ``` 没有作弊，随机，111111111111111111111111

<!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>
        h2 {
            text-align: center;
        }
        .wrap {
            text-align: center;
        }
        button{
            width: 150px;
            height: 50px;
            background-color: #ccc;
            outline: 0;
            border: 0;
            border-radius: 5px;
            font-size: 20px;
        }

        .userWrap {
            background-color: skyblue;
            overflow: hidden;
            width: 500px;
            margin: 10px auto;
        }

        /* 11 */
        .userWrap li {
            list-style: none;
            float: left;
            width: 80px;
            height: 50px;
            line-height: 50px;
            background-color: #e9e9e9;
            border: 1px solid red;
            margin: 5px;
            text-align: center;
        }

        /* 20 */
        .userWrap .selected {
            background-color: yellow;
        }
    </style>
</head>
<body>
    <h2>恭喜：0</h2>

    <div class="wrap">
        <button id="star">开始</button>
        <button id="stop">停止</button>
    </div>

    <ul class="userWrap">

    </ul>
</body>
<script>
    /*
        1.页面布局（开始和停止的按钮）
        2.根据用户数组动态创建一个标签
    */ 
    var users = ['1',"2","3","4","5","6","7","8","9","10",
    '11',"12","13","14","15","16","17","18","19","20",
    '21',"22","23","24","25","26","27","28","29","30",
    '31',"32","33","34","35","36","37","38","39","40",
    '41',"42","43","44","45","46","47","48","49","50",
    '51',"52","53","54","55","56","57","58","59","60",
    '61',"62","63","64","65","66","67","68","69","70",
    '71',"72","73","74","75","76","77","78","79","80",
    '81',"82","83","84","85","86","87","88","89","90",
    '91',"92","93","94","95","96","97","98","99","100",
    ]

    // 2.根据数组中的每个元素动态的创建一个li节点，并设置内容
    var listr = '';
    for(var i=0; i<users.length; i++){
        listr += "<li>" + users[i] + "</li>"
    }

    // 3.把拼接好的字符串listr作为ul的内容
    var userWrap = document.getElementsByClassName('userWrap')[0];
    userWrap.innerHTML = listr;


    var starEle = document.getElementById('star')
    var stopEle = document.getElementById('stop')
    var lis = document.getElementsByTagName('li')
    var timerArr = []; // 因为用户会多次点击，会产生多个定时器，用来记录所有的定时器变量
    var nowIndex; //记录当前选中的下标
    // 4.给id=star绑定单击事件
    starEle.onclick = function(){
        //  0-user.length  0 - 23 
        // 获取到最小和最大的下标
        var minIndex = 0;
        var maxIndex = users.length;

        // 每隔0.5秒随机去一个用户
        var timer = setInterval(function(){
            // 在最小和最大下标之间随机去一个值，作为我们选中的
            nowIndex = Math.floor( Math.random()*(maxIndex-minIndex) );
            // 排他思想（当前索引添加类，同辈兄弟要移除类）
            for(var i=0; i<lis.length; i++){
                lis[i].className = '';
            }
            // 通过下标找到对应的li元素
            // lis[nowIndex].style.backgroundColor = "yellow";
            lis[nowIndex].className = 'selected'
            document.getElementsByTagName('h2')[0].innerHTML = '恭喜你：' + users[nowIndex]
        },10)
        timerArr.push(timer);
        console.log(timerArr)
        
    }

    // 5.给id=stop绑定单击事件
    stopEle.onclick = function(){
        // 清除之前所有的定时器
        for(var i=0; i<timerArr.length; i++){
            clearInterval(timerArr[i]);
        }
    
        document.getElementsByTagName('h2')[0].innerHTML = '恭喜你：' + users[nowIndex]
    }



   
</script>
</html>