间歇定时器和延时定时器

201 阅读1分钟

定时器-间歇函数

开启定时器

语法格式:

setInterval(function(){
    
},3000)
function sun = {
    console.log(123)
}
// 每隔一秒调用sun函数
setInterval(sun, 1000)

作用: 每隔多少时间调用这个函数

间隔时间单位毫秒

关闭定时器

语法格式

let 变量名 = setInterval(函数, 间隔时间)
clearInterval(变量名)

定时器案例

<button class='btn' disabled>我已同意该协议(6)</button>
<script>
    //获取元素
    let btn = document.querySelector('.btn')
	//写一个变量,用来计时
	let i = 6
    //开启定时器
    let timer = setInterval(function (){
        i--  //每隔一秒减1
        btn.innerHTML = 我已阅读该协议(${i})
	//判断 i = 0后关闭定时器
 		if(i === 0){
    	clearInterval(timer)
            //开启按钮
            btn.disabled = false
          btn.innerHTML = 我已同意该协议 
		}
    }, 1000)
</script> 

定时器-延时函数

setTimeout

setTimeout(回调函数, 等待的毫秒数)

setTimeout仅仅执行一次,可理解为把这段代码延迟执行(大白话:如定时炸弹)

清除定时器

let timer = setTimeout(回调函数, 等待毫秒数)
clearTimeout(timer)

小结:

setlnterval的特征是重复执行,首次执行会延时

setTimeout色特征是延迟执行,只执行1次

setTimeout结合递归函数,能模拟setlnterval重复执行

clearTimeout清除由setTimeout创建的定时器任务