1.实现的效果如图所示:
2.程序代码(两种计时器分别实现)
1) setTimeout(" ", )
<!DOCTYPE html> <html> <head> <title>浏览器对象</title> <meta http-equiv="Content-Type" content="text/html; charset=gkb"/> </head> <body> <h2>操作成功</h2> <p><span id="time">5</span>秒后回到主页<a href="" onclick="window.history.back();">返回</a></p> <script type="text/javascript"> var second=5; //获取显示秒数的元素,通过定时器来更改秒数。 function show(){ second=second-1; if(second>0) { document.getElementById("time").innerHTML=second; var k=setTimeout("show()",1000); } else { clearTimeout(k); location.href="http://www.imooc.com/"; } } setTimeout("show()",0); //通过window的location和history对象来控制网页的跳转。 </script> </body> </html>
2) setInterval(" ", )
tml> <head> <title>浏览器对象</title> <meta http-equiv="Content-Type" content="text/html; charset=gkb"/> </head> <body> <h2>操作成功</h2> <p><span id="time">5</span>秒后回到主页<a href="" onclick="window.history.back();">返回</a></p> <script type="text/javascript"> var second=5; //获取显示秒数的元素,通过定时器来更改秒数。 function show(){ second=second-1; if(second>0) { document.getElementById("time").innerHTML=second; } else { location.href="http://www.imooc.com/"; } } setInterval("show()",1000); //通过window的location和history对象来控制网页的跳转。 </script> </body> </html>