实现倒计时案例

最新推荐文章于 2024-04-23 21:46:50 发布

秃头桑

最新推荐文章于 2024-04-23 21:46:50 发布

阅读量261

点赞数

文章标签： javascript css html5 css3 html

本文链接：https://blog.csdn.net/qq_45052409/article/details/107450250

版权

<!DOCTYPE html>
<html lang="zh-CN">

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

<body>
    <script>
        // 1.输入的时间减去现在的时间就是剩余的时间，即倒计时，但是不能拿着时分秒详见，例如05减去25分，结果会是负数的。(将来的时间减去现在的时间)
        // 2.用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数。
        // 时间戳 new Date()
        // 3.把剩余时间的毫秒数转换为天、时、分、秒(时间戳转换为时分秒)
        /*
            转换公式如下：
            d=parseInt(总秒数/60/60/24)  // 计算天数
            h=parseInt(总秒数/60/60%24)  // 计算小时
            m=parseInt(总秒数/60%60)  // 计算分数
            s=parseInt(总秒数%60)  // 计算当前秒数
        */
        /*
            1.封装函数
            2.创建两个时间戳  一个是现在的，一个是将来的(将来的：是用户输入的)
            3.剩余的时间等于 将来的时间减去 现在的时间 在除以1000(为什么要除以1000：把时间换算成秒更精确，一秒等于一千毫秒)
            4.剩余时间的毫秒数转换为天、时、分、秒

        */

        function nav(time) {
            var jin = +new Date(); // 现在的毫秒数
            var wei = +new Date(time); // 未来的毫秒数
            var zong = (wei - jin) / 1000; // 总的毫秒数，未来的时间减去现在的时间 除以一千(一千：换算成秒，一秒等于一千毫秒)
            var d = parseInt(zong / 60 / 60 / 24)  // 计算天数
            // d = d < 10 ? '0' + d : d;
            var h = parseInt(zong / 60 / 60 % 24)  // 计算小时
            h = h < 10 ? '0' + h : h;
            var m = parseInt(zong / 60 % 60)  // 计算分数
            m = m < 10 ? '0' + m : m;
            var s = parseInt(zong % 60)  // 计算当前秒数
            s = s < 10 ? '0' + s : s;
            // 返回值
            return d + '天' + h + '时' + m + '分' + s + '秒';
        }
        console.log(nav('2023-6-6 17:35:00'));


    </script>
</body>

</html>