JavaScript 的定时器
setInterval( )
循环定时器:固定时间间隔指定一次,像闹钟一样,不关闭继续执行。
按照指定的周期(毫秒),来调用函数或计算表达式,方法会不停的调用函数
clearInterval():清除计时器
语法结构:
setInterval(调用函数名称,执行的时间),以毫秒为单位
setTimeout( )
炸弹定时器:只执行一次,不能执行下一次了
在指定的毫秒数后调用函数或计算表达式,清除计时器使用 clearTimeout()
定时器用法案例
<script type="text/javascript">
/*JS中的定时器分为两种:
(1)循环定时器:setInterval():循环执行(调用函数)
(2)炸弹定时器:setTimeout(): 只执行一次*/
//有函数名的
var time=setInterval(show,3000);
function show(){
alert('我一定会回来的');
}
//匿名函数
var time_01=setTimeout(function(){
alert('我只执行了一次!');
},2000)
</script>
计时器案例
获取当前时间
使用setInterval()
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用setInterval()</title>
<script type="text/javascript">
var timer=setInterval('myTime()',1);
function myTime(){
var times=new Date();
var h=times.getHours();
var m=times.getMinutes();
var s=times.getSeconds();
m=zero(m);
s=zero(s);
var ms=times.getMilliseconds();
document.getElementsByTagName('body')[0].innerHTML='当前时间为:'+h+'时'+m+'分'+s+'秒'+ms+'毫秒';
function zero(i){
if (i<10) {
i='0'+i;
}
return i;
}
}
</script>
</head>
<body>
</body>
</html>
使用setTimeout()
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用setTimeout()</title>
<script type="text/javascript">
function myTime(){
var div1=document.getElementById('div1');
var times=new Date();
var h=times.getHours();
var m=times.getMinutes();
var s=times.getSeconds();
m=zero(m);
s=zero(s);
var ms=times.getMilliseconds();
div1.innerHTML='当前时间为:'+h+':'+m+':'+s+':'+ms
setTimeout('myTime()',1);
function zero(i){
if (i<10) {
i='0'+i;
}
return i;
}
}
</script>