setInterval()函数实现前端定时器

setInterval是一个实现定时调用的函数,可按照指定的周期(以毫秒计)来调用函数或计算表达式。setInterval方法会不停地调用函数,直到 clearInterval被调用或窗口被关闭。
由setInterval返回的ID值可用作clearInterval方法的参数。
一个简单的例子:

var times = 0;
var showTime = null;
//计时器
setInterval(function() {
	times++;
	showTime = "时间  ";
	if(times >= 60) {
		// 大于60秒转换为 xx:xx 格式,如:01:11
		if(Math.floor(times / 60) < 10) {
			showTime = showTime + "0" + Math.floor(times / 60) + ":";
		} else {
			showTime = showTime + Math.floor(times / 60) + ":";
		}
	}
	// 小于十分钟则在分钟前面补0,如:01:00
	if(times % 60 < 10) {
		showTime = showTime + "0" + times % 60;
	} else {
		showTime = showTime + times % 60;
	}
	// time为id,将时间显示在id为time的标签属性内即可
	time.innerHTML = showTime;
}, 1000);

1000为周期每隔1000毫秒也就是1秒就执行该方法一次
在body中可以如下:

<span id="time">0</span>

这样就可以在前端页面实现一个简单的定时器了。

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值