js 点名器

最新推荐文章于 2022-09-28 21:58:22 发布

我拿青春赌未来~

最新推荐文章于 2022-09-28 21:58:22 发布

阅读量137

点赞数 3

本文链接：https://blog.csdn.net/helongzhi/article/details/125236426

版权

HTML+css

  <style>
        div {
            width: 100px;
            height: 100px;
            border: 1px solid black;
            text-align: center;
        }
    </style>
</head>

<body>
    <div id="divs"></div>
    <button id="btn1" >开始</button>
    <button id="btn2" >结束</button>

js代码

 // 获取元素
        var div = document.querySelector("#divs");
        var btn1 = document.querySelector("#btn1");
        var btn2 = document.querySelector("#btn2");
        // 建立名字的数组
        var names= ["张三", "李四", "王五", "陈六", "赵七"];
       
        // console.log(arr.length);
        // 定时器
        var timeId;
        // 注册事件
       btn1.onclick=function(){

            
            timeId = setInterval(function () {

                    // 随机数
                var index= parseInt(Math.random()*names.length);
                //   改变姓名
                div.innerHTML=names[index];
            }, 30)
        }
        btn2.onclick=function(){
            // 清除定时器
            clearInterval(timeId);
        }