zoukankan      html  css  js  c++  java
  • 原生javascript实现计时器

    成品图如意下所示:

    实现加到等于5的时候停止

    搭建HTML结构

    1 minutes:<input type="text" value="0">
    2 seconds:<input type="text" value="0">

    开始写javascript代码

     1         var minutesNode = document.getElementsByTagName('input')[0]; 
     2             var secondsNode = document.getElementsByTagName('input')[1];
     3             var minutes = 0,  //设置两个初始值为0
     4                 seconds = 0; 
     5 
     6             var timer = setInterval(function(){       //开启定时器
     7                 seconds ++;                              //seconds每10毫秒加1
     8                 if(seconds == 60){                    //当seconds一直增加到等于60的时候
     9                     seconds = 0;                      //seconds清空等于0
    10                     minutes ++;                        //然后miutes加上1
    11                 }
    12                 secondsNode.value = seconds;        //secods == secondsNode里面的value
    13                 minutesNode.value = minutes;        //minutes == minutesNode里面的value
    14                 if(minutes == 5){                    //当minutes一直增加到等于5的时候
    15                     clearInterval(timer);            //清理定时器,停止运行!!!
    16                 }
    17             },10);

    谢谢观看,有大佬路过指点指点意见

  • 相关阅读:
    maven
    Antd@4.x Form的常用方法
    数组排序 js
    链式调用
    react 非登陆页面得公共部分配置方法
    react异常处理
    Field 输入框的bug
    promise的用法
    异步return公共数据方法,
    小程序打开pdf文件
  • 原文地址:https://www.cnblogs.com/yangpeixian/p/10777660.html
Copyright © 2011-2022 走看看