js实现时分秒倒计时,兼容ios

2019-11-26  本文已影响0人  吴涛涛
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>倒计时</title>
    </head>
    <body>
        <div>
            <!--<span id="_d">00</span>-->
            <span id="_h">00</span>
            <span id="_m">00</span>
            <span id="_s">00</span>
            <!--<span id="_ms">00</span>    -->
        </div>
        <script type="text/javascript">
            function countTime() {
                var date = new Date();
                var now = date.getTime();    
                var endDate = new Date("2019-12-01 00:00:00".replace(/-/g,'/'));//设置截止时间
                var end = endDate.getTime();
                var leftTime = end - now; //时间差                              
                var d, h, m, s, ms;
                if(leftTime >= 0) {
                    // d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
                    h = Math.floor(leftTime / 1000 / 60 / 60);
                    m = Math.floor(leftTime / 1000 / 60 % 60);
                    s = Math.floor(leftTime / 1000 % 60);
                    ms = Math.floor(leftTime % 1000);
                    if(ms < 100) {
                        ms = "0" + ms;
                    }
                    if(s < 10) {
                        s = "0" + s;
                    }
                    if(m < 10) {
                        m = "0" + m;
                    }
                    if(h < 10) {
                        h = "0" + h;
                    }
                } else {
                    console.log('已结束。。。')
                }
                //将倒计时赋值到div中
                // document.getElementById("_d").innerHTML = d + "天";
                document.getElementById("_h").innerHTML = h + "时";
                document.getElementById("_m").innerHTML = m + "分";
                document.getElementById("_s").innerHTML = s + "秒";
                // document.getElementById("_ms").innerHTML = ms + "毫秒";
                //递归每秒调用countTime方法,显示动态时间效果
                setTimeout(countTime, 50);
            }

            countTime();
        </script>
    </body>
</html>
上一篇 下一篇

猜你喜欢

热点阅读