JS学习之定时器与倒时器

1、定时器

设置定时器：

window.setInterval(“执行的函数”,间隔时间)

取消定时器：

clearInterval(定时器名称)

2、倒时器

倒时器是定时器中的一种，只是设置一个时间，等到了该时间就去做某些事情

setTimeout(“函数”, 时间 )

假设：

我们要计算的倒计时

有一个最终时间 12月12日

有一个现在时间 11月 13日

倒计时 = 用将来的时间 - 现在的时间

问题：用毫秒减去现在距离 1970年1

将来时间距离 1970 毫秒数

用将来的毫秒数 - 现在的毫秒数不断转换就可以了

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        body{
            font-size:30px;
            text-align: center;
            color:red;
        }
    </style>
    <script>
        window.onload = function(){
            var demo = document.getElementById("demo");
            var endTime = new Date("2015/12/12 17:30:00"); // 最终时间
            setInterval(clock,1000); // 开启定时器
            function clock(){
                var nowTime = new Date(); // 一定是要获取最新的时间
                //  console.log(nowTime.getTime());  获得自己的毫秒
                var second = parseInt((endTime.getTime() - nowTime.getTime()) / 1000);
                // 用将来的时间毫秒 -  现在的毫秒  / 1000 得到的 还剩下的秒  可能处不断 取整
               // console.log(second);
                 // 一小时 3600 秒
                // second / 3600  一共的小时数  /24   天数
                var d = parseInt(second / 3600 / 24);  //天数
                //console.log(d);
                var h = parseInt(second / 3600  % 24)  // 小时
               // console.log(h);
                var m = parseInt(second / 60  % 60);
                //console.log(m);
                var s = parseInt(second % 60); // 当前的秒
                console.log(s);
               /* if(d<10)
                {
                    d = "0" + d;
                }*/
                d<10 ? d="0"+d : d;
                h<10 ? h="0"+h : h;
                m<10 ? m="0"+m : m;
                s<10 ? s="0"+s : s;
                demo.innerHTML = "距离抢购时间还剩: "+d+"天 "+h+"小时 "+m+"分钟 "+s+"秒";
            }
        }
    </script>
</head>
<body>
<div id="demo"></div>
</body>

JS学习之定时器与倒时器

1、定时器

2、倒时器

猜你喜欢