DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript技巧 >> JS定時器實現數值從0到10來回變化
JS定時器實現數值從0到10來回變化
編輯:JavaScript技巧     

效果:數值從0到10來回變化

代碼:

var a=0
var timer1,timer2;
function add(){
a++;
console.log(a);
if(a>=10){
clearInterval(timer1);
timer2=setInterval(sub,200);
}
}
function sub(){
a--;
console.log(a);
if(a<=0){
clearInterval(timer2);
timer1=setInterval(add,200);
} 
}
timer1=setInterval(add,200);

----------分割線------------------------

此效果看似簡單,但是實際寫的時候發現JS定時器有一些不易察覺的坑,一不小心就會造成定時器疊加,導致變化越來越快,直到變化間隔達到浏覽器的極限(chrome的為5ms)。值得注意的是,雖然每次都用clearInterval把timer清楚掉了,但是每次新的循環還是會使timer的值在原有基礎上加1

以上所述是小編給大家介紹的JS定時器實現數值從0到10來回變化,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對網站的支持!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved