如何在网页中动态显示时间

在网页中动态显示时间, 需要用到Windows对象方法: setInterval(code,millisec[,"lang"])

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。(详细请参考: W3 School描述: https://www.w3school.com.cn/jsref/met_win_setinterval.asp)

setInterval方法有两个参数, code 指向要执行的代码, millsec是执行的间隔时间.

在Code代码中, 需要将当前的时间, 填写到一个对象中, 在这个对象中进行显示: 

 

如下代码, 使用JavaScrip写了一个getTime函数, 在这个函数中,将时间写到 ID为'TimeShow'对象中.

<p id = 'TimeShow'> </p>

<script>
   function getTime(){
           document.getElementById("TimeShow").innerHTML =  Date();
        }
 
        setInterval(getTime, 1000)
</script>

代码执行后,显示如下:

 

 需要说明的是, 'TimeShow' 对象, 可以是<p>, <div>, <Span>, <button>, <input>, 可以根据自己喜欢的样式进行选择, 也可以自己写一个专门的用于时间显示的Class类, 来进行显示.

 

posted @ 2020-06-13 21:47  Montai  阅读(2114)  评论(0编辑  收藏  举报