javascript之定时器以及秒表（含原码）

最新推荐文章于 2022-04-01 15:28:53 发布

七月2333

最新推荐文章于 2022-04-01 15:28:53 发布

阅读量228

点赞数 2

文章标签： javascript html5 html

本文链接：https://blog.csdn.net/qq_58877067/article/details/120856953

版权

JavaScript Date对象定时器 setInterval 时间格式化

关键词由CSDN通过智能技术生成

日期：

var data=new Date(年，月，日，时，分，秒，毫秒);

也可以 var data=new Date（10000）,不过会是以1970年1月1日，00点为参照的

Date.parse()

格式：Date.parse(日期对象)

功能：可以将日期对象转为毫秒数；

d.getTime()/d.setTime();

格式：日期对象.getTime/setTime

功能：获取当前日期转为毫秒数；

data.setTime(100);

重置时间（以1970年为标准）

传入日期：2021-10-1 或者2021/10/1;两种形式

定时器：

setInterval(函数，毫秒数)；

功能：对应的毫秒数，执行一次传入的函数；

    var i=0;
        function num(){
            if(i==10){
              clearInterval(timer);
            }
            document.write(i++ +"<br/>");
        }
       var timer=setInterval(num,1000);

window.οnlοad=function(){} 表示页面加载完毕后才会运行；

<style>
    *{font-size: 20px;}
    #div1{ width: 200px; height: 300px; margin: 50px auto;   border: 2px solid gray;  background-color: indianred;
    }
    button{display: block;  margin: 30px auto;}
    .box{height: 20px;text-align: center; line-height: 30px; margin: 20px auto; box-shadow: grey grey; }
</style>
<script>
    function $(id){return document.getElementById(id);}
    var i=0;
    var isRuning=false;
    var timer=null;
    window.οnlοad=function(){
       function starttime(){ 
          timer=setInterval(function(){
            i++;
            $("sec").innerHTML=doublenum(i%60) ;
            $("min").innerHTML=doublenum(parseInt(i/60)) ;
            $("hour").innerHTML=doublenum( parseInt(i/3600));
        },1000)};
       function pausetime(){
           clearInterval(timer);
       }
       $("start").οnclick=function(){
           if(!isRuning){
               $("start").innerHTML='开始';
               pausetime();
               isRuning=true;
           }else{
               $("start").innerHTML='暂停';
               starttime();
               isRuning=false;
           }
       }
       $("reset").οnclick=function(){
           i=0;
           isRuning=true;
           clearInterval(timer);
           $("start").innerHTML='开始';
           $("sec").innerHTML="00";
            $("min").innerHTML="00";
            $("hour").innerHTML="00";
       }
    }
    function doublenum(n){
      if(n<10){
          return "0"+n;
      }else{
          return n;
      }
    }
    </script>
<body>
    <div id="div1">
        <div class="box">
      <span id="hour">00</span>  <span>:</span>
        <span id="min">00</span>   <span>:</span>
        <span id="sec">00</span></div>
        <button id="start" >开始</button>
        <button id="reset">复位</button>
    </div>
</body>

七月2333

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript之定时器以及秒表（含原码）

日期：var data=new Date(年，月，日，时，分，秒，毫秒);也可以 var data=new Date（10000）,不过会是以1970年1月1日，00点为参照的Date.parse()格式：Date.parse(日期对象)功能：可以将日期对象转为毫秒数；d.getTime()/d.setTime();格式：日期对象.getTime/setTime功能：获取当前日期转为毫秒数；data.setTime(100);重置时间（以1970年为标准）传入日期
复制链接

扫一扫