定时器:
setTimeout setInterval clearTimeout clearInterval
语法:
setTimeout(function(){},延迟时间,第一函数的参数)
三个参数:
第一个:
callback(钩子函数),当某个“事件”(某个条件成立触发的函数)
第二个:
延迟的时间 按毫秒计算,1秒=1000毫
第三个:
钩子函数的实参
指定时间,只触发一次函数
setInterval(function(){},延迟时间,第一函数的参数)
......(同上)
每隔一段时间就执行一次代码,只要不关闭就不断执行
返回值:
number类型的数字,这个数字(编号),每添加一个定时器就会加1
这个返回值会一直在计算机中存储,就算关闭定时器也存储
关闭定时器:(clearInterval也能用)
clearTimeout(定时器的编号);
小栗子:
1 let arr = ['张三', '李四', '王五', '赵六', '钱孙', '周吴', '郑王']; 2 let timer = null,num = 0,n=0; 3 but1.onclick = function(){ 4 timer = setInterval(function(){ 5 p.innerHTML = arr[num]; 6 num ++; 7 // n++; 8 num %= arr.length; 9 // if(n == 100){ 10 // clearInterval(timer); 11 // p.innerHTML = arr[5]; 12 // }//内定中奖,作弊代码 13 },60); 14 }; 15 but2.onclick = function(){ 16 clearInterval(timer); 17 p.innerHTML = arr[5]; 18 }
HTML5标准规定
setTimeout的最短时间间隔是4毫秒;
setInterval的最短间隔时间是10毫秒,也就是说,小于10毫秒的时间间隔会被调整到10毫秒
书和MDC
在John Resig的新书《Javascript忍者的秘密》一书中提到
Browsers all have a 10ms minimum delay on OSX and a(approximately) 15ms delay on Windows.
在苹果机上的最小时间间隔是10毫秒,
在Windows系统上的最小时间间隔大约是15毫秒。
MDC中关于setTimeout的介绍中也提到,Firefox中定义的最小时间间隔(DOM_MIN_TIMEOUT_VALUE)是10毫秒,HTML5定义的最小时间间隔是4毫秒。
后台模式
大多数电脑显示器的刷新频率是60HZ,大概相当于每秒钟重绘60次。因此,最平滑的动画效的最佳循环间隔是1000ms/60,约等于16.6ms。
为了节电,对于那些不处于当前窗口的页面,浏览器会将时间间隔扩大到1000毫秒。
另外,如果笔记本电脑处于电池供电状态,Chrome和IE9以上的版本,会将时间间隔切换到系统定时器,大约是16.6毫秒。