抽奖效果

最新推荐文章于 2024-05-11 17:08:08 发布

吴机智

最新推荐文章于 2024-05-11 17:08:08 发布

阅读量62

点赞数

分类专栏：案例文章标签： js

本文链接：https://blog.csdn.net/m0_49893750/article/details/108502819

版权

案例专栏收录该内容

45 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div></div>
    <button>确定</button>
    <script>
        var arr = ['特等奖: 一套房', '一等奖: 一辆奔驰迈巴赫', '二等奖: 一个阮锦涛', '三等奖: 电动平衡车', '参与奖: 王树林'];
        // 效果: 打开页面, div内容每隔一段时间更新一次, 内容需要随机更改
        var div = document.getElementsByTagName('div')[0];
        // 间隔定时器
        var time = setInterval(function(){
            // 获取到随机下标
            var num = Math.floor(Math.random() * arr.length);
            console.log(arr[num]);
            // 赋值给div
            div.innerHTML = arr[num];
        }, 60);

        // 点击确定，需要清除定时器
        var btn = document.getElementsByTagName('button')[0];
        btn.onclick = function(){
            clearInterval(time);
        }
    </script>
</body>

</html>