HTML實時時間代碼可以讓網頁上顯示當前的時間,可以用于許多網頁設計和交互中。以下是一段示例代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>實時時間</title> <script> window.onload=function(){ setInterval(function(){ var date=new Date(); var hour=date.getHours(); var minute=date.getMinutes(); var second=date.getSeconds(); var time=hour + ":" + minute + ":" + second; document.getElementById("time").innerText=time; },1000); } </script> </head> <body> <h1>當前時間為:<span id="time"></span></h1> </body> </html>
代碼解釋:
首先是聲明文檔類型和html標記,在head標記中設置頁面標題和meta元素。JavaScript代碼在script標記中定義。
在window.onload事件中,使用setInterval函數和匿名函數來實現每秒鐘更新實時時間,函數內部定義一個Date對象來獲取當前時間,再將小時、分鐘和秒拼接成一個字符串保存在變量time中。然后使用document對象的getElementById方法找到id為“time”的元素并設置其innerText,即將實時時間顯示在網頁上。
在body標記中,使用css樣式調整顯示效果,將時間放在h1標記中,并設置id為“time”。
通過這段HTML實時時間代碼,可以實現網頁上顯示當前的時間,并且隨著時間的變化自動更新,非常方便實用。