这篇文章给大家分享的是有关js实现内置计时器的方法的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。
计时器对于图片轮播和倒计时之类的与时间相关的项目有着很大的联系，它是实现这些的核心语法，如何一次深刻理解js计时器？往下看你就知道，有惊喜哦！
js计时器有两种，一种为延时后单次的执行，另一种为延时多次执行。通过函数的递归，前者也可以打破壁垒，拥有循环执行的功能。
setTimeout( javascript语句 , 毫秒);
（其中第一个值可以是一个函数 需要加" "，也可以是代码）
//延迟一段时间 执行 执行一次
setInterval("javascript语句" , 毫秒);
（其中第一个值可以是一个函数 需要加" "，也可以是代码）
//循环执行
具体实例 （一些细节和具体的用法还是在案例代码中便于理解）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>计时器</title>
</head>
<body>
<button id="none">停止计时器</button>
<button id="start">开始计时器</button>
<script>
// 有两个计时器
// setTimeout();
// 延迟一段时间 执行 执行一次
// setInterval();
// 循环执行
var stoptime=document.getElementById('none');//默认从零开始自加 获取开始按钮
var starttime=document.getElementById('start');//获取停止按钮
var count=0;
var timecount;
// 第一种
/*showtime();
function showtime(){
count++;
console.log(count);
timecount=setTimeout('showtime()',1000);//延时一秒
}//利用递归来实现循环时间
stoptime.onclick=function(){//停止计时器
clearTimeout(timecount);//将计时器清除，即停止自加
}
starttime.onclick=function(){//开始计时器
timecount=setTimeout('showtime()',1000);//继续开始自加
}*/
//优点：重启计时器简单，由于是原本是单次执行，只需将之前的递归函数重新复制即可 缺点：需要递归调用
// 第二种
showtime();
function showtime(){//封装函数
timecount=setInterval(function(){
count++;
console.log(count);
},1000)
}
stoptime.onclick=function(){
clearInterval(timecount);
}
starttime.onclick=function(){
showtime();
}
//优点：不需要递归调用，直接实现循环。缺点：重启较复杂，需要调用所有函数，建议封装函数。
</script>
</body>
</html>感谢各位的阅读！关于“js实现内置计时器的方法”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
