• 【js】日时分秒倒计时


      <div class="widgetDock" style="height: 5px;">
                                                                
                                                                <div class="lui_dataview_daojishi_date">
                                                                    <h5>距离中秋还有:<span class="dds">dspan>h5>
                                                                    <span class="hour">1span> <strong>:strong>
                                                                    <span class="minute">2span> <strong>:strong>
                                                                    <span class="second">3span>
                                                                div>
                                                                <script>
                                                                    //获取元素
                                                                    var days=document.querySelector(".dds");
                                                                    var hour = document.querySelector(".hour");
                                                                    var minute = document.querySelector(".minute");
                                                                    var second = document.querySelector(".second");
                                                                    //获取截止时间的时间戳(单位毫秒)
                                                                    var inputTime = +new Date("2022-09-10 00:00:00");
    
                                                                    //我们先调用countDown函数,可以避免在打开界面后停一秒后才开始倒计时
                                                                    countDown();
                                                                    //定时器 每隔一秒变化一次
                                                                    setInterval(countDown, 1000);
    
                                                                    function countDown() {
                                                                        //获取当前时间的时间戳(单位毫秒)
                                                                        var nowTime = +new Date();
                                                                        //把剩余时间毫秒数转化为秒
                                                                        var times = (inputTime - nowTime) / 1000;
                                                                        // 计算时间差day
                                                                        var d=parseInt(times/60/ 60 / 24);
                                                                        //如果天数小于 10,要变成 0 + 数字的形式 赋值给盒子
                                                                        days.innerHTML=d < 10 ? "0" + d : d;
                                                                        //计算小时数 转化为整数
                                                                        var h = parseInt(times / 60 / 60 % 24);
                                                                        //如果小时数小于 10,要变成 0 + 数字的形式 赋值给盒子
                                                                        hour.innerHTML = h < 10 ? "0" + h : h;
                                                                        //计算分钟数 转化为整数
                                                                        var m = parseInt(times / 60 % 60);
                                                                        //如果分钟数小于 10,要变成 0 + 数字的形式 赋值给盒子
                                                                        minute.innerHTML = m < 10 ? "0" + m : m;
                                                                        //计算描述 转化为整数
                                                                        var s = parseInt(times % 60);
                                                                        //如果秒钟数小于 10,要变成 0 + 数字的形式 赋值给盒子
                                                                        second.innerHTML = s < 10 ? "0" + s : s;
                                                                    }
                                                                script>
                                                            div>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
  • 相关阅读:
    JAVA IDEA 下载
    FastAPI 学习之路(二十二)依赖项
    springmvc
    JavaScript设计模式(三) 迭代器模式 发布-订阅模式
    【SpringCloud】八、SpringCloudAlibaba-流量防卫兵Sentinel
    【HMS core】【FAQ】Analytics Kit、Push Kit典型问题合集3
    批量修改视频尺寸:简单易用的视频剪辑软件教程
    【计算机网络】第一章 概述
    rabbitmq 从入门到精通
    文件包含 [ZJCTF 2019]NiZhuanSiWei1
  • 原文地址:https://blog.csdn.net/qq_40320447/article/details/126707512