JavaScript（二十六）倒计时demo

最新推荐文章于 2022-09-04 12:00:52 发布

We_jia

最新推荐文章于 2022-09-04 12:00:52 发布

阅读量150

点赞数

分类专栏： JavaScript 文章标签：倒计时

本文链接：https://blog.csdn.net/We_jia/article/details/87892440

版权

JavaScript 专栏收录该内容

39 篇文章 1 订阅

订阅专栏

倒计时效果展示图

全部代码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        .b {
            width: 80px;
            height: 100px;
            border: 1px solid silver;
            float: left;
            margin: 10px 10px;
            text-align: center;
            line-height: 100px;
        }
    </style>

</head>
<body>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>

<script>
    var b = document.getElementsByClassName("b");
    //定义一个固定时间
    var timego = new Date("2020 4-26 00:00:00");
    var timenow = setInterval(function () {
        //获取当前时间
        var localtime = new Date();
        /*getTime()  获取当前时间到1970总毫秒数*/
        var timeres = timego.getTime() - localtime.getTime();
        var sec = parseInt(timeres / 1000);   //总秒数
        var secth = sec % 60;  //秒
        var minth = parseInt(sec / 60) % 60;  //分
        var houth = parseInt(sec / 3600) % 24;   //小时
        var datth = parseInt(sec / (3600 * 24)) % 31;    //天
        var month = parseInt(sec / (3600 * 24 * 31)) % 12;   //月
        var yeath = parseInt(sec / (3600 * 24 * 31 * 12)) % 100;//年

        b[0].innerHTML = yeath + "年";
        b[1].innerHTML = month + "月";
        b[2].innerHTML = datth + "日";
        b[3].innerHTML = houth + "时";
        b[4].innerHTML = minth + "分";
        b[5].innerHTML = secth + "秒";

        var hao = (timeres % 1000);
        var res = "";
      /*  if (hao < 10) {
            res = "00" + hao;
        }
        else if (hao > 10 && hao < 100) {
            res = "0" + hao;
        }
        else{
            res=hao;
        }*/
        res=(hao<10?"00"+hao:hao>10&&hao<100?"0"+hao:hao);
        b[6].innerHTML =res+"毫秒";
    }, 1)


</script>


</body>
</html>