2分钟倒计时-毫秒

mz. Study

已于 2022-11-30 13:58:28 修改

阅读量278

点赞数

文章标签：前端 html javascript

于 2022-11-30 13:56:45 首次发布

本文链接：https://blog.csdn.net/m0_65690596/article/details/128113937

版权

<html>
    <head>
    <meta charset="UTF-8">
    <title>2分钟（毫秒）倒计时</title>
    </head>
    <body>
        <div id="timer" style="color:red"></div>

        <script>
             let maxtime = 60 * 2 * 1000; //2分钟，按毫秒计算，自己调整!   
                const zero = (value) => {
                       return value > 9 ? value : `0` + value
                    }

                function CountDown() {
                    if (maxtime >= 0) {
                        minutes = Math.floor(maxtime / 1000 / 60);
                        seconds = Math.floor(maxtime / 1000 % 60);
                        ms = Math.floor(maxtime % 1000 / 10);
                        msg = "距离结束还有" + zero(minutes) + "分" + zero(seconds) + "秒" + zero(ms) + '毫秒';
                        document.querySelector('#timer').innerHTML = msg;
                        maxtime -= 10
                    } else{
                        clearInterval(timer);
                        alert("时间到，结束!");
                    }
                }

                timer = setInterval(CountDown, 10); 
        </script>
    </body>
    </html>