2015年7月21日 星期二

Web前端程式設計：練習_計時器

利用Date()和setInterval設計一個會變動秒數的計時器


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<html>
<head>
<Meta Charset="utf-8">
<title> 計時器 </title>
<script type="text/javascript">
 function startime()
 {
  var today=new Date();//產生日期物件，new Date()，會傳回當時的日期
  var h=today.getHours();//取得小時 {0 - 23}
  var m=today.getMinutes();//取得分鐘{0 - 59}
  var s=today.getSeconds();//取得秒{0 - 59}
  
  m=checkTime(m);
  s=checkTime(s);
  document.getElementById('time').innerHTML=h+":"+m+":"+s;
 }
//分鐘和秒數要維持兩位數，所以要判斷當低於10時，要補0
 function checkTime(i){
  if(i<10)
  {
   i="0"+i;
  }
  return i;
 }
</script>

</head>
<body onload="startime();">
<!--執行網頁就顯示-->
<h1>計時器 練習</h1>
<p>
<span id="time"></span>
<script>setInterval(startime, 1000);</script>
<!--每秒執行一次-->
</p>

</body>
</html>
計時器.HTML
張貼者： 於
標籤： , ,

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)