js时间定时器setTimeout&setInterva

js时间定时器setTimeout&setInterva

1.延时性的定时器 setTimeout 只会执行一次

setTimeout(function() {
			 	alert('我是延时3秒执行的弹窗')
			 }, 3000);

执行后效果

2.间隔型定时器 setInterval 每间隔一段时间(time)就会执行一次

setInterval(function(){
				console.log('间隔两秒执行一次')
			},2000)

执行后效果图

**定时器还有对应的清除定时器功能，因为在我们功能实现中可能有用到定时器，各种暂停定时器的需要，这个时候就可能用到我们的清除定时器
1.*clearTimeout(timer)*这是清除延时定时器的方法。
HTML

JS

var timer;
			function start(){
				timer = setTimeout(function(){
					alert('我是三秒后的弹窗')
				},3000)
			}
			function cancel(){
				clearTimeout(timer)
			}

效果

当我们点击‘点击弹窗’的按钮，延时定时器(setTimeout)就会执行，在3秒前点击‘取消弹窗’的按钮，延时定时器就会失效。
*clearInterval(timer)*这是清除间隔定时器的方法
HTML

JS

var timer;
			function start(){
				timer = setInterval(function(){
					console.log('间隔30毫秒执行一次')
				},30)
			}
			function cancel(){
				clearInterval(timer)
				alert('间隔定时器被取消')
			}

点击‘执行间隔定时器’效果

点击‘取消执行’后效果

清除间隔定时器后，我们的输出就会停止。