韩顺平网页设计第四十二讲1

来源：互联网发布：设计专业显示器知乎编辑：程序博客网时间：2024/05/20 23:56

window的方法setInterval()的使用案例：

每隔一秒刷新时间

//setInterval()按照指定的周期来循环调用函数或者表达式。是一个window对象//每隔一秒钟弹出hello wordfunction sayHello(){window.alert("hello");}//简单的时钟function showTime(){//document.writeln(new Date());//两个元素间的文本可以通过 对象.innerText 来传递document.getElementById("mytime").innerText = new Date().toLocaleString();}//setInterval("sayHello()",1000);setInterval("showTime()",1000);//1000表示每隔一秒钟一次</script>  </head>  <body>    <input type="button" value="删除记录" onclick="test()">    <span id="mytime"></span>  </body>

window的方法setInterval()的使用案例：

几张静态图片动态显示：

<script  language="javascript" type="text/javascript">//setInterval()按照指定的周期来循环调用函数或者表达式。是一个window对//让静态图片跑起来var n=1;function runChild(){if(n>100)n=1;//得到mying对象var myimg=document.getElementById("myimg");myimg.src="images/"+((n++)%2)+".jpg";}setInterval("runChild()",100);</script>  </head>   <body>  <img src="images/0.jpg" id="myimg"/>    </body>

上面实例中，如果要小人往前走，只需要给小人加style属性left值就可以了。

setTimeout()是指定时间以后调用，但是只调用一次。

cleanInterval可以取消用setInterval设置的timeout值。

小矮人跑30次，然后停止五秒钟，然后继续跑30次循环下去，代码如下：

<script  language="javascript" type="text/javascript">//setInterval()按照指定的周期来循环调用函数或者表达式。是一个window对//让静态图片跑起来,同时跑累了歇一会儿//setInterval可以返回一个给cleanInterval设置的值。相当于timeout的一个编号var n=1;function runChild(){if(n>30){    //停止第一个定时器    clearInterval(myTimer);    //五秒以后启动第二个定时器    setTimeout("reRun()",5000);n=1;}//得到mying对象var myimg=document.getElementById("myimg");myimg.src="images/"+((n++)%2)+".jpg";}//第一个定时器var myTimer = setInterval("runChild()",100);function reRun(){myTimer = setInterval("runChild()",100); //第二个定时器}</script>  </head>   <body>  <img src="images/0.jpg" id="myimg"/>    </body>