js 活动倒计时

最新推荐文章于 2023-10-31 11:12:06 发布

置顶喵大叔、

最新推荐文章于 2023-10-31 11:12:06 发布

阅读量294

点赞数

分类专栏： js 文章标签：活动倒计时

本文链接：https://blog.csdn.net/weixin_43990297/article/details/103249975

版权

js 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

最近在项目中需要写活动倒计时，就在这记录一下，比较基础，还能继续优化封装

					<span id="_d">00</span>
                    <span id="_h">00</span>
                    <span id="_m">00</span>
                    <span id="_s">00</span>
                    /* /****************************************/
			// 倒计时
                function countTime() {
                    //获取当前时间  
                    var date = new Date();
                    var now = date.getTime();
                    //设置截止时间  
                    var str = "2019/12/12 00:00:00";
                    var endDate = new Date(str);
                    var end = endDate.getTime();

                    //时间差  
                    var leftTime = end - now;
                    //定义变量 d,h,m,s保存倒计时的时间  
                    var d, h, m, s;
                    if (leftTime >= 0) {
                        d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
                        h = Math.floor(leftTime / 1000 / 60 / 60 % 24);
                        m = Math.floor(leftTime / 1000 / 60 % 60);
                        s = Math.floor(leftTime / 1000 % 60);
                    }
                    if (d < 10) {
                        d = '0' + d
                    }
                    if (h < 10) {
                        h = '0' + h
                    }
                    if (m < 10) {
                        m = '0' + m
                    }
                    if (s < 10) {
                        s = '0' + s
                    }
                    //将倒计时赋值到div中  
                    document.getElementById("_d").innerHTML = d + "<span class='date_text''> 天</span>";
                    document.getElementById("_h").innerHTML = h;
                    document.getElementById("_m").innerHTML = m;
                    document.getElementById("_s").innerHTML = s;
                    //递归每秒调用countTime方法，显示动态时间效果  
                    setTimeout(countTime, 1000);

                }
                // 调用方法
                countTime()