语法规范:
1 window.setTimeout(调用函数,延时时间)
2 window.setInterval(调用函数,延时时间)
相同点:
1 这个window在调用的时候可以省略
2 这个延时时间单位是毫秒 但是可以省略 如果默认是0
3 这个调用函数可以直接写函数 还可以写函数名 或者'函数名()'
4 页面中可能有多个计时器 我们经常会给定时器加标识符 也就是名字
不同点:
setTimeout只会调用一次setInterval重复调用根据延长时间
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function callback () {
console.log('我是setTimeout');
}
setTimeout(callback,3000);
//window.clearTimeout(timeout ID)停止计时器
window.addEventListener('load',function () {//窗口加载事件
var begin=document.querySelector('.begin');
var stop=document.querySelector('.stop');
var timer=null;//设置全局变量 null是一个空对象
begin.addEventListener('click',function () {
timer=setInterval(function(){
console.log('我是setInterval');
},4000);
})
stop.addEventListener('click',function () {
clearInterval(timer);//停止计时器
})
})
</script>
<button class="begin">开始</button>
<button class="stop">结束</button>
</body>
</html>