1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
5 <title>Date对象的使用-时钟特效</title>
6 <script type="text/javascript">
7 window.onload=function(){
8 //获取第一个input标签
9 var inputone=document.getElementsByTagName("input")[0];
10
11 //给input标签添加点击事件
12 inputone.onclick=function(){
13 setTimeout("timeFun()",2000);
14 }
15
16 //获取第2个input标签
17 var inputtwo=document.getElementsByTagName("input")[1];
18
19 //给input标签添加点击事件
20 var timestr;
21 inputtwo.onclick=function(){
22 timestr=setInterval("timeFun()",1000);
23 }
24
25 //获取第2个input标签
26 var inputthree=document.getElementsByTagName("input")[2];
27
28 //给input标签添加点击事件
29 inputthree.onclick=function(){
30 clearInterval(timestr);
31 }
32
33 }
34
35 function timeFun(){
36 var date=new Date();
37 var year=date.getFullYear(); //获取四位年份
38 var month=date.getMonth()+1; //月份
39 var day =date.getDate(); //一个月中某一天,范围1-31
40 var week=date.getDay(); //星期
41 var hour=date.getHours(); //小时数,24进制
42 var minutes=date.getMinutes(); //分钟
43 var second=date.getSeconds(); //秒
44 var time=year+"年"
45 +month+"月"
46 +day+"日 星期"+week+" "
47 +hour+"时"+minutes+"分"+second+"秒";
48 console.log(time);
49 document.getElementsByTagName("div")[0].innerHTML=time;
50
51
52 }
53 </script>
54 </head>
55
56 <body>
57 <input type="button" value="3秒后出现"/>
58 <input type="button" value="动态时钟"/>
59 <input type="button" value="停止时钟"/>
60 <div id="time">
61 </div>
62 </body>
63 </html>
时间： 2024-08-10 17:18:45