window对象有两个主要的定时方法,分别是setTimeout 和 setInteval 他们的语法基本上相同,但是完成的功能取有区别。
setTimeout方法是定时程序,也就是在什么时间以后干什么。干完了就拉倒。
setInterval方法则是表示间隔一定时间反复执行某操作。
如果用setTimeout实现setInerval的功能,就需要在执行的程序中再定时调用自己才行。如果要清除计数器需要 根据使用的方法不同,调用不同的清除方法:
setTimeout (表达式,延时时间)//切记表达式是要加引号的;
setInterval(表达式,交互时间)
延时时间/交互时间是以豪秒为单位的(1000ms=1s)
这两种方法可能看起来非常像,而且显示的结果也会很相似,不过两者的最大区别就是,setTimeout方法不会每隔5秒钟就执行一次showTime函数,它是在每次调用setTimeout后过5秒钟再去执行showTime函数。这意味着如果showTime函数的主体部分需要2秒钟执行完,那么整个函数则要每7秒钟才执行一次。而setInterval却没有被自己所调用的函数所束缚,它只是简单地每隔一定时间就重复执行一次那个函数。
setTimeout 在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次
setInterval 在执行时,它从载入后,每隔指定的时间就执行一次表达式
<html>
<head>
<title>无标题文档</title>
<script type="text/javascript" language="javascript">
var myTime;
function showTime(){
var time = new Date( ); //获得当前时间
var hour = time.getHours( ); //获得小时、分钟、秒
var minute = time.getMinutes( );
var second = time.getSeconds( );
document.form1.myclock.value =hour+":"+minute+":"+second ;
}
myTime = setInterval("showTime()",1000);
function stopTime(){
clearInterval(myTime);
}
function startTime(){
myTime=setInterval("showTime()",1000);
}
</script>
</head>
<body >
<form name="form1">
<h2>当前时间:
<input type="text" size="10" name="myclock"/>
</h2>
<p>
<label>
<input type="button" name="" value="停止" onClick="stopTime()">
<input type="button" name="" value="开始" onClick="startTime()">
</label>
</p>
</form>
</body>
</html>