定时执行,在设定时间后会执行代码的内容,如
setTimeout(function(){
console.log('aa')
},1000)
在1秒后(1000毫秒)控制台打印aa
setInterval
每隔设定的时间执行一次代码,如
setInterval(function(){
console.log('aa')
},1000)
每1秒(1000毫秒)在控制台打印aa,直到使用clearInterval停止
<div id="tt"></div><script>
setInterval(()=>{
var d=new Date(),t=[]
t[0]=d.getHours(),t[1]=d.getMinutes(),t[2]=d.getSeconds(),t[3]=d.getMilliseconds()
tt.innerHTML=t.map((e,i)=>("000"+e).slice(i<3?-2:-4)).join(":")
},5)
</script>
直接上代码,可以直接运行<html>
<head>
<style>
*{margin:0padding:0}
#box{width:400pxheight:400pxmargin:40px auto}
#box div{width:200pxheight:40pxborder:1px #F3C solidtext-align:centerfloat:leftfont-size:26px}
#box button{float:leftmargin-top:10pxmargin-left:20px}
#box span{float:leftwidth:200pxheight:100pxoverflow-y:autodisplay:blockborder:1px #C9C solidmargin-top:10px}
</style>
</head>
<body>
<div id="box">
<div id="timer"></div>
<button onClick="btTime()">btTime</button>
<button onClick="count()">count</button>
<span id="show"></span>
</div>
<script type="text/javascript">
var timer=document.getElementById("timer")
var butt=document.getElementsByTagName("button")
var show=document.getElementById("show")
var m='000'//分
var s='00'//秒
var ms='000'//毫秒
timer.innerHTML=m+":"+s+":"+ms
var x=0,y=0,f=0,w=0,t1,t2
var flag=0
function btTime(){
switch (flag){
case 0 : flag=1w=1t2=setInterval(beginMs,10)t1=setInterval(beginS,1000)butt[0].
innerHTML='stop'break
case 1 : flag=2clearInterval(t1)clearInterval(t2)butt[0].innerHTML='reset'break
case 2 : flag=0w=0x=0y=0m='000'show.innerHTML=""s='00'ms='000'timer.innerHTML=m+":"+s+":"+msbutt[0].innerHTML='btTime'break
}
}
function beginS(){//计算秒
x++
if(x<=9){
s='0'+x
}else if(x>=10&&x<=59){
s=x
}else if(x>59){
f++
x=0
s='00'
}
if(m<=999&&m>=100){
m=f
}else if(m>=10&&m<=99){
m='0'+f
}else if(m<10){
m='00'+f
}
timer.innerHTML=m+":"+s+":"+ms
}
function beginMs(){//计算毫秒
y+=10
/*if(y<10){
ms='00'+y
}else */if(y>=10&&y<=99){
ms='0'+y
}else if(y>=100&&y<=999){
ms=y
}else{y=0ms="000"}
timer.innerHTML=m+":"+s+":"+ms
}
function count(){
if(w==1){
show.innerHTML+=timer.innerHTML+"<br>"
}
}
</script>
</body>
</html>