首页 > 代码库 > js时钟

js时钟

2024-09-20 21:59:32   220人阅读

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <style type="text/css">
 7         *{
 8             margin:0;
 9             padding:0;
10         }
11         h2{
12             width:50px;
13             margin:0 auto;
14         }
15         div{
16             width: 300px;
17             text-align: center;
18             background: red;
19             margin:50px auto;
20         }
21     </style>
22     <script type="text/javascript">
23         window.onload= function () {
24             getTime();
25             setInterval(getTime,1000);
26             function getTime() {
27                 var date = new Date();
28                 var hours = date.getHours();
29                 var one = parseInt(hours / 10);
30                 var two = parseInt(hours % 10);
31                 var minutes = date.getMinutes();
32                 var three = parseInt(minutes / 10);
33                 var four = parseInt(minutes % 10);
34                 var second = date.getSeconds();
35                 var five = parseInt(second / 10);
36                 var six = parseInt(second % 10);
37                 var imgs = document.getElementsByTagName("img");
38                 imgs[0].src = "images/" + one + ".png";
39                 imgs[1].src = "images/" + two + ".png";
40                 imgs[2].src = "images/" + three + ".png";
41                 imgs[3].src = "images/" + four + ".png";
42                 imgs[4].src = "images/" + five + ".png";
43                 imgs[5].src = "images/" + six + ".png";
44             }
45         }
46     </script>
47 </head>
48 <body>
49 <h2>时钟</h2>
50 <div>
51 <img src="images/0.png">
52 <img src="images/0.png">：
53 <img src="images/0.png">
54 <img src="images/0.png">：
55 <img src="images/0.png">
56 <img src="images/0.png">
57 </div>
58 </body>
59 </html>

技术分享

js时钟


联系
我们