话不多说,直接上图
上代码
<html> <head> <title>Title</title> </head> <body> <span id="ti"> </span> <br> <input id="tz" type="button" value="停止"> <script> let a=setInterval("sj()",1000); function sj(){ let date=new Date(); let time=date.getFullYear()+"年"+(date.getMonth())+1+"月"+date.getDate()+"日"+"\t"+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds(); document.getElementById("ti").innerText=time; } let tz=document.getElementById("tz"); tz.οnclick=function (){ clearInterval(a); } </script> </body> </html>
开始分析:setInterval就是一运行就能一直执行方法,setInterval(”方法“,时间),时间一般写1000,这是换算的,它默认执行间隔为1毫秒,由于速度太块,换算成1秒,也就是1000,不管它,它就会将方法一直运行下去,所以我们需要一个能停止它的方法,那就是
clearInterval(setInterval(”方法“,时间)的返回值),大家可以试试,运行出来的效果是打开浏览器,时间一直在实时更新,点击停止后,时间暂停。其它比较重要的就是时间函数的使用了,有求时间(年、月、日、时、分、秒)的方法了,还有<span>标签的(innerText=值)赋值方法。
外延:setTimeout()是打开浏览器后,自动执行一次,因为次数太少,基本不用,可以试试看