原生javascript实现计时器
成品图如意下所示:
实现加到等于5的时候停止

搭建HTML结构
minutes:<input type="text" value="0">
seconds:<input type="text" value="0">
开始写javascript代码
         var minutesNode = document.getElementsByTagName('input')[0];
             var secondsNode = document.getElementsByTagName('input')[1];
             var minutes = 0,  //设置两个初始值为0
                 seconds = 0; 
             var timer = setInterval(function(){       //开启定时器
                 seconds ++;                              //seconds每10毫秒加1
                 if(seconds == 60){                    //当seconds一直增加到等于60的时候
                     seconds = 0;                      //seconds清空等于0
                     minutes ++;                        //然后miutes加上1
                 }
                 secondsNode.value = seconds;        //secods == secondsNode里面的value
                 minutesNode.value = minutes;        //minutes == minutesNode里面的value
                 if(minutes == 5){                    //当minutes一直增加到等于5的时候
                     clearInterval(timer);            //清理定时器,停止运行!!!
                 }
             },10);
谢谢观看,有大佬路过指点指点意见
原生javascript实现计时器的更多相关文章
- 原生javascript 实现 animate
		原生javascript 实现 animate //animate function getstyle(obj,name){ if(obj.currentStyle){ return obj.curr ... 
- 浅谈 原生javaScript&&react 实现全局触摸按钮(附带对addeventlistener的了解)
		1.采用原生javaACript 实现全局触摸按钮 首先在控制台输出,观察事件有哪些关于触摸的字段可以使用,然后拿这些字段的数据开始来写方法. 因为要做的是全局触摸按钮,我需要拿到的是按钮时时的坐标位 ... 
- 你可能不需要 jQuery!使用原生 JavaScript 进行开发
		很多的 JavaScript 开发人员,包括我在内,都很喜欢 jQuery.因为它的简单,因为它有很多丰富的插件可供使用,和其它优秀的工具一样,jQuery 让我们开发人员能够更轻松的开发网站和 We ... 
- 原生JavaScript技巧大收集(11~20)-(终于又被我找到这篇文章了)
		11.原生JavaScript加入收藏夹 function AddFavorite(sURL, sTitle) { try { window.external.addFavorite(sURL, sT ... 
- 原生javascript加载运行
		原生javascript加载运行 (function(){ //TODO sometings }()); 在要运行相应代码的位置加入script标签,创建函数并自执行; 关于window.onload ... 
- 原生javascript模仿win8等待进度条。
		一.序言 一直很中意win8等待提示圆圈进度条.win8刚出来那会,感觉好神奇!苦于当时没思路,没去研究.通过最近网上找找资料,终于给搞出来了!先上Demo,献丑了!预览请看:win8进度条. 二.简 ... 
- 表单美化-原生javascript和jQuery单选按钮(兼容IE6)
		最近很多人问怎么美化表单的元素,大家都知道表单元素在各个浏览器中的表现不一,反正也是特别的丑,那么问题就来了,我们能自己设计表单元素的外观么?答案是可以的,现在我们就来试试吧.我们用两种方式来实现这一 ... 
- javascript学习-原生javascript的小特效(原生javascript实现链式运动)
		以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ... 
- javascript学习-原生javascript的小特效(多个运动效果整理)
		以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ... 
随机推荐
- eclipse需要的环境变量就两个,一个是java_home指向JDK。另一个是Tomcat,自己去preference-sever下new一个
			1.eclipse需要的环境变量就两个,一个是java_home指向JDK.另一个是Tomcat,自己去preference-sever下new一个 
- 多线程调用COM组件的体会(CoInitialize)
			调用任何COM组件之前,你必须首先初始化COM套件环境,即调用CoInitialize或CoInitializeEx.COM套件环境在线程的生存周期内有效,线程退出前需要调用CoUninitializ ... 
- django 简易博客开发 2 模板和数据查询
			首先还是贴一下项目地址 https://github.com/goodspeedcheng/sblog 因为代码全在上面 上一篇博客我们介绍了 django的安装配置,新建project,新建a ... 
- C++第9周(春)项目5 - 一元一次方程类
			课程首页在:http://blog.csdn.net/sxhelijian/article/details/11890759,内有完整教学方案及资源链接 [项目5]设计一元一次方程类.求形如ax+b= ... 
- 工作总结   使用html模板发邮件 前面空一大块
			HTML邮件的本质其实是发送了一个html页面.邮件的空白必然是页面的空白,所以你要找到你发送邮件的html模板所在,然后去掉空白即可,如果这是一个公共文件,需要注意你往往用的只是你的部分,很大程度还 ... 
- 深入源代码解析Android中的Handler,Message,MessageQueue,Looper
			本文主要是对Handler和消息循环的实现原理进行源代码分析.假设不熟悉Handler能够參见博文< Android中Handler的使用>,里面对Android为何以引入Handler机 ... 
- 使用python生成c文件模板
			目标 完成一个python脚本,实现指定名字后,自动生成.c和.h的模板.例如: /** * @file epc.c * @author 陈维 * @version V01 * @date 2017. ... 
- Sql sever 分组排序
			维护人事的时候人事局要求加入一个新功能,详细需求例如以下:加入的人员在同一个单位的依照顺序编号而且单位也要实现时间排序,也就是说有两个排序,第一单位名称排序.先创建的一直在前.然后依照创建时间依次排序 ... 
- 4448: [Scoi2015]情报传递|主席树|离线操作
			能够把全部的操作离线,然后树链剖分将全部人搜集情报的时间增加到主席树中,查询的时候能够直接查询搜集情报时间≤i−C[i]−1的人的个数 时间复杂度n∗log22n,空间复杂度n∗log2n #incl ... 
- 查看android-support-v4.jar引出的问题
			1.前面博文里也写过如何关联android-support-v4.jar的源码 今天新项目用上述方法的时候,竟然不成功..来回反复试了很长时间,最后发现 新建项目,会自动引用一个类库(自动新建的..) ... 
