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


Posted in Javascript onApril 19, 2018

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

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>3water.com 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 相关文章推荐
EXT中xtype的含义分析
Jan 07 Javascript
JavaScript拆分字符串时产生空字符的解决方案
Sep 26 Javascript
jQuery判断元素上是否绑定了指定事件的方法
Mar 17 Javascript
浅谈下拉菜单中的Option对象
May 10 Javascript
Vue组件tree实现树形菜单
Apr 13 Javascript
jquery实现左右轮播图效果
Sep 28 jQuery
vue实现多级菜单效果
Oct 19 Javascript
微信小程序顶部导航栏可滑动并选中放大
Dec 05 Javascript
JavaScript常用工具函数库汇总
Sep 17 Javascript
Vue 解决在element中使用$notify在提示信息中换行问题
Nov 11 Javascript
JavaScript实现HTML导航栏下拉菜单
Nov 25 Javascript
在HTML中使用JavaScript的两种方法
Dec 24 Javascript
vue 实现通过手机发送短信验证码注册功能
Apr 19 #Javascript
详解react-redux插件入门
Apr 19 #Javascript
vuex state及mapState的基础用法详解
Apr 19 #Javascript
使用vuex的state状态对象的5种方式
Apr 19 #Javascript
react redux入门示例
Apr 19 #Javascript
JS实现读取xml内容并输出到div中的方法示例
Apr 19 #Javascript
使用typescript开发angular模块并发布npm包
Apr 19 #Javascript
You might like
晶体管单管来复再生式收音机
2021/03/02 无线电
Banner程序
2006/10/09 PHP
PHP XML error parsing SOAP payload on line 1
2010/06/17 PHP
php实现XSS安全过滤的方法
2015/07/29 PHP
thinkPHP下ueditor的使用方法详解
2015/12/26 PHP
php微信开发之自定义菜单实现
2016/11/18 PHP
php实现统计二进制中1的个数算法示例
2018/01/23 PHP
收藏Javascript中常用的55个经典技巧
2007/08/12 Javascript
javascript JSON操作入门实例
2010/04/16 Javascript
jquery实现类似淘宝星星评分功能实例
2014/09/12 Javascript
JS脚本根据手机浏览器类型跳转WAP手机网站(两种方式)
2015/08/04 Javascript
websocket+node.js实现实时聊天系统问题咨询
2017/05/17 Javascript
vue 如何添加全局函数或全局变量以及单页面的title设置总结
2017/06/01 Javascript
从零开始搭建vue移动端项目到上线的步骤
2018/10/15 Javascript
[01:05:29]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第二场 1月24日
2021/03/11 DOTA
Python爬取网页中的图片(搜狗图片)详解
2017/03/23 Python
Python数据结构之栈、队列的实现代码分享
2017/12/04 Python
对Python中range()函数和list的比较
2018/04/19 Python
Python键盘输入转换为列表的实例
2018/06/23 Python
python创造虚拟环境方法总结
2019/03/04 Python
Python简易计算器制作方法代码详解
2019/10/31 Python
Django查询优化及ajax编码格式原理解析
2020/03/25 Python
英国第二大营养品供应商:Vitabiotics
2016/10/01 全球购物
印度最好的在线药品订购网站:PharmEasy
2018/11/30 全球购物
精美的手工家居和生活用品:Nkuku
2019/11/01 全球购物
中式餐厅创业计划书范文
2014/01/23 职场文书
银行见习期自我鉴定
2014/01/29 职场文书
单位租房协议书范本
2014/12/04 职场文书
营业员岗位职责
2015/02/11 职场文书
婚前保证书范文
2015/02/28 职场文书
趣味运动会加油词
2015/07/18 职场文书
一封真诚的自荐信帮你赢得机会
2019/05/07 职场文书
2019生态环境保护倡议书!
2019/07/03 职场文书
在HTML中引入CSS的几种方式介绍
2021/12/06 HTML / CSS
MySQL查询日期时间
2022/05/15 MySQL
Redis keys命令的具体使用
2022/06/05 Redis