前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >js实现倒计时

js实现倒计时

原创
作者头像
用户1349575
发布2022-02-09 14:49:21
5.5K0
发布2022-02-09 14:49:21
举报
文章被收录于专栏:编程社区编程社区

利用原生js实现倒计时,注意Date()函数中表示月份的参数介于 0 到 11 之间。也就是说,如果希望把月设置为 2 月,则参数应该是 1。

代码语言:javascript
复制
<script type="text/javascript">
        window.onload = function () {


            var oDiv1 = document.getElementById('div1')
            var oDiv2 = document.getElementById('div2')
            var oDiv3 = document.getElementById('div3')

            function timeGo() {

                var now = new Date();

                var future = new Date(2020, 8, 28, 10, 35, 0)

                // 相减得到的是毫秒,需要除以1000得到秒
                var lefts = parseInt((future - now) / 1000)

                var day = parseInt(lefts / 86400)
                var hour = parseInt((lefts % 86400) / 3600)
                var min = parseInt(((lefts % 86400) % 3600) / 60)
                var sec = lefts % 60


                oDiv1.innerHTML = now;
                oDiv2.innerHTML = future;
                oDiv3.innerHTML = day + "天 "+" "+ +todou(hour) + ":" + todou(min) + ":" + todou(sec);
            }

            timeGo();

            setInterval(timeGo,1000);

            // 按标准格式显示时间00:00:00,否则当时、分、秒的数字小于10时,会以单数字形式表现0.0.0.

            function todou(num) {

                if (num < 10) {
                    return '0' + num;
                }
                else {
                    return num;
                }

            }

        }
    </script>
</head>

<body>
    <div id="div1"></div>
    <div id='div2'></div>
    <div id='div3' style="color:red;"></div>
</body>

</html>

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档