当前位置:主页 > javascript教程 > JS使用setInterval实现的简单计时器功能示例

JS使用setInterval实现计时器功能

发布:2020-02-07 10:16:45 78


给大家整理一篇javascript相关的编程文章,网友冷寻真根据主题投稿了本篇教程内容,涉及到JS、setInterval、计时器、JS使用setInterval实现的简单计时器功能示例相关内容,已被297网友关注,相关难点技巧可以阅读下方的电子资料。

JS使用setInterval实现的简单计时器功能示例

本文实例讲述了JS使用setInterval实现的简单计时器功能。分享给大家供大家参考,具体如下:

使用setInterval实现计时,并且满60秒向分钟进一,满60分钟向小时进一。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>www.jb51.net JS计时器</title>
    <script>
      window.onload = function(){
      var mm = 0;
      var ss = 0;
      var str = '';
      var timer = setInterval(function(){
      str = "";
      if(++ss==60)
      {
      if(++mm==60)
      {
      mm=0;
      }
      ss=0;
      }
      str+=mm<10?"0"+mm:mm;
      str+=":";
      str+=ss<10?"0"+ss:ss;
      document.getElementById("d").innerHTML = str;
      },1000);
      };
    </script>
  </head>
  <body>
  <div id="d"></div>
  </body>
</html>

运行结果:

JS使用setInterval实现的简单计时器功能示例

希望本文所述对大家JavaScript程序设计有所帮助。


参考资料

相关文章

  • JS布尔对象的toString() valueOf()使用用法

    发布:2020-02-03

    这篇文章主要介绍了JS的布尔对象的toString()方法和valueOf()方法,是JavaScript入门学习中的基础知识,需要的朋友可以参考下


  • JavaScript之Vue.js【入门基础】

    发布:2022-04-03

    本文主要介绍一下Vue.js并附上在Node.js环境下搭建一个简单的Demo实例代码。条理清晰,有助于阅读和理解。有需要的朋友可以看下


  • JS中的算法与数据结构之字典(Dictionary)示例效果

    发布:2020-01-26

    这篇文章主要介绍了JS中的算法与数据结构之字典(Dictionary),结合实例形式详细分析了javascript数据结构中字典的概念、原理、定义与常见使用方法,需要的朋友可以参考下


  • Node.js中使用计时器定时执行函数的方法实例

    发布:2019-08-09

    这篇文章主要介绍了Node.js中使用计时器定时执行函数详解,本文使用了Node.js中的setTimeout和setInterval函数,需要的朋友可以参考下


  • python使用flask与js进行前后台交互的实现方法详解

    发布:2019-11-03

    今天小编就为大家分享一篇python使用flask与js进行前后台交互的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧


  • 学习MySQL JSON数据类型操作

    发布:2020-03-11

    这篇文章主要介绍了MySQL操作之JSON数据类型操作详解,内容较为详细,具有收藏价值,需要的朋友可以参考。


  • JavaScript实现飘落星星特效的代码详解

    发布:2019-09-23

    这篇文章主要为大家详细介绍了基于JavaScript实现飘落星星特效,具有一定的参考价值,感兴趣的小伙伴们可以参考一下


  • JS实现表格排序的实例方法

    发布:2020-01-20

    这篇文章主要介绍了JS实现简单表格排序操作,结合具体实例形式分析了JavaScript事件响应及table表格动态操作相关技巧,需要的朋友可以参考下


网友讨论