定时器
定时器的类型,主要分为两种:
1、每隔特定的时间调用一次,重复调用
setInterval (function(){} ,1000);
2、在特定时间之后调用函数,只调用一次
setInterval(function(){},1000);
定时器的关闭
由于上一步所说的两个函数均有返回值,我们可以定义一个变量
var time = null;
time = setInterval (function(){} ,1000);
//关闭定时器
clearInterval(time);
还有一种我们不定义变量,直接使用:
clearInterval(10);//关闭定时器
表示在重复执行第十次后关闭定时器。
简单的例子:
<!DOCTYPE html>
<html><head>
<meta charset="UTF-8">
<title>定时器</title><script>
window.onload = function() {
var time = null;
var btn11 = document.getElementById("btn1");
var btn22 = document.getElementById("btn2");btn11.onclick = function() {
//time = setInterval(show, 1000); //间隔型,每隔1000毫秒执行一次
time = setTimeout(show , 1000);//一次性,只执行一次
};btn22.onclick = function() {
alert(time);
//clearInterval(time);
clearTimeout(time);
};function show() {
alert(123);
}};
</script>
</head><body>
<input id="btn1" type="button" value="开启" onclilk="start()" />
<input id="btn2" type="button" value="关闭" onclilk="end()" />
</body>
</html>
定时器的应用
主要应用有:
菜单导航、无缝滚动、缓冲滚动、淡入淡出、延时提示框、匀速运动停止等等。
js定时器应用小案例源码:
https://download.csdn.net/download/spurs611/10911023