JS特效之定时器

发表于 | 分类于 |
字数统计: 286 | 阅读时长 ≈ 1

1.定时器setTimeout();

这个方法用于实现定时切换，例如setTimeout('boom()',2000);2秒后
调用boom()函数。
但是它不能实现时间周期性变换。要想实现周期变化，可以循环使用。

2.定时器setInterval();

这个方法用于实现时间周期性变换。
可以实现例如电影中炸弹的定时器5，4，3，2，1的变化。setInterval('boom()',1000);每间隔1秒，调用boom()
但是它不能清除，也就是说它还会从0变为负数

3.清除定时器

使用clearTimeout();或者clearInterval();使用后可以达到清除定时器的效果。
具体用哪一个根据所要清除的定时器名来决定
如果有很多定时器，我们常用赋变量名方式来区分
例如 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script>
function boom(){
	var t=document.getElementsByName('act')[0]; 
    var time=parseInt(t.value)-1;
	t.value=time;	
	if(time==0){
	document.getElementsByTagName('img')[0].src="img/top1.jpg";
	clearInterval(clock);//定时器变为0之后将不再变化
	}
}
var clock=setInterval('boom()',1000);
</script>

<body>
<input type="button" name="act" value="3"/>
<img src="img/black.jpg" />
</body>