思路:
*得到当前时间
var date = new Date();
//格式化为本地时间
var d1 = date.toLocaleString();
*使页面每秒显示一次时间
setInterval() 定时器实现
*显示到页面
获取div标签并将时间写入
代码:
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8" />
5 <title>动态显示时间</title>
6
7 <style type="text/css">
8 #times{
9 width: 200px;
10 height: 20px;
11 border: 3px solid gray; /*如果不加实线无法显示边框*/
12 }
13 </style>
14 </head>
15
16 <body>
17 <div id="times">
18
19 </div>
20
21 <script type="text/javascript">
22 //得到时间并写入div
23 function getDate(){
24 //获取当前时间
25 var date = new Date();
26 //格式化为本地时间格式
27 var date1 = date.toLocaleString();
28 //获取div
29 var div1 = document.getElementById("times");
30 //将时间写入div
31 div1.innerHTML = date1;
32 }
33 //使用定时器每秒向div写入当前时间
34 setInterval("getDate()",1000);
35 </script>
36 </body>
37 </html>