效果圖:
代碼如下:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>一個簡單的數字時鐘</title> <script type="text/javascript" charset="utf-8"> // 定義一個函數用以顯示當前時間 function displayTime() { var elt = document.getElementById("clock"); // 通過id= "clock"找到元素 var now = new Date(); // 得到當前時間 elt.innerHTML = now.toLocaleTimeString(); //讓elt來顯示它 setTimeout(displayTime,1000); //在1秒後再次執行 } window.onload = displayTime; //當onload事件發生時開始顯示時間 </script> <style type="text/css" media="all"> #clock { font: bold 24pt sans; background: #ddf; padding: 10px; border: 2px solid black; border-radius: 10px; } </style> </head> <body> <h1>一個簡單的數字時鐘</h1> <span id="clock"></span> </body> </html>
以上就是本文的全部內容,希望本文的內容對大家的學習或者工作能帶來一定的幫助,同時也希望多多支持!