JS实现随机点名

html部分

<style>
        .f div {
            width: 50px;
            /* height: 50px; */
            background-color: yellowgreen;
            text-align: center;
            line-height: 50px;
            margin: 50px 50px;
            margin-right: 0px;
            float: left;
        }
        .f .go {
            background-color: red;
        }
    </style>
    <input type="button" value="开始" id="begin" onclick="changeColor()">
    <input type="button" value="暂停" id="end" onclick="stopTextColor()">
    <div id="f" class="f">
        <div>aaa</div>
        <div>bbb</div>
        <div>ccc</div>
        <div>ddd</div>
        <div>eee</div>
        <div>fff</div>
    </div>

js实现

<script>
        var a;
        var mnum = 0;
        var nIntervId;
        //获取全部的人
        var getFirstChild = document.getElementById("f").children;
        function named(min, max) {
            a = mnum;
            //生成0~总人数之间的随机数
            mnum = Math.floor(Math.random() * (max - min) + min);
            var elem = getFirstChild[mnum];
            //先清除上次选中的样式
            getFirstChild[a].removeAttribute("class");
            //本次选中的添加样式
            elem.className = 'go';
        }
        function changeColor() {
            if (!nIntervId) {
                //console.log(!nIntervId);
                // debugger
                //创建定时器调用named();
                nIntervId = setInterval('named(0,getFirstChild.length)', 100);
            }
        }
        function stopTextColor() {
            //用于停止定时器
            clearInterval(nIntervId);
            nIntervId = null;
        }
        </script>