17.用JavaScript实现如下效果：一个div的宽度从其初始宽度1px，每秒增长1px，直到变到100px，再从100px每秒减少1px，直到变回到1px，如此反复5次后，该变化停止，并将其最

来源：互联网发布：超级软件编辑：程序博客网时间：2024/05/02 02:06

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><meta http-equiv="Content-Type"content="text/html; charset=UTF-8"><title>在此处插入标题</title></head><body><div id="abc"style="width:1px;height:50px;border:1px solid">12</div><script type="text/javascript">window.onload= function(){setTimeout(b,0);setTimeout(clearInterval(),200*5*1000);function a(){ var abc=document.getElementById('abc'); if(parseInt(abc.style.width)<11) abc.style.width=(parseInt(abc.style.width)+1)+'px'; else {clearInterval();setInterval(b,1000);}}function b(){ var abc=document.getElementById('abc'); if(parseInt(abc.style.width)>1) abc.style.width=(parseInt(abc.style.width)-1)+'px'; else  {clearInterval();setInterval(a,1000);} }} </script> </body> </html>

大致思路：刚开始是从1px加到100px,先调用a()函数，当宽等于100时，清除调用a函数的时间计时器，开启另外一个调用b的时间计时器，当宽等于1px时，清除调用b函数的时间计时器，开启另外一个调用a的时间计时器.另外等一段时间后，结束所有计时器，设置宽度为50px;这个方法太耗内存了，电脑卡的要死！

0 0