使用setInterval()方法输出一个计时器

本文通过实例代码介绍了JavaScript中使用setInterval()方法创建一个计时器的实现方式,包括时间对象的创建、计时器的开启与关闭以及时间差的计算。点击按钮可以启动或关闭计时器,显示精确的秒和毫秒。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

var a = 0;b = 0;
   var time = false                    
   var td
   var date = new Date()                                          //创建一个时间对象
   var startTime = date.getTime()                           //创建一个变量获得一个由1970年1月1日0点0分到现在的毫秒数
   console.log(startTime)
  function Btn_Click(){                                            //给一个按钮创建点击会触发的效果
  if(time){                                                          //逻辑锁,刚开始定义的是false,所以,它会先执行else里面的代码
 clearInterval(td)                 
}else{
date = new Date()                         //还是创建一个时间对象,用于再次点击将开始的取得的时间覆盖掉
startTime = date.getTime()
td = setInterval(diaoyong,1)       //创建一个setInterval()方法,每隔1毫秒执行里面的方法
}
    time = !time                                                      //取反,用于判断第一次点击和第二次点击的效果
}
function diaoyong(){
date = new Date()
startTime1 = date.getTime()             
var str = (startTime1 - startTime)      //获得当前的时间,减去前面获得的时间,获得两者所经历的时间
a = Math.floor(str/1000)               //将获得的时间向下取整,除一千是因为时间戳获得的时间跟setInterval()设置的时间有个偏差,所以需要使用这种方法来消除掉这个误差
b = Math.floor(str%1000)           //将它取余,获得它的毫秒数
txt.innerHTML = a+":"+b            //将获得的时间输出出来
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值