快捷導(dǎo)航

JavaScript頁面實(shí)時(shí)顯示當(dāng)前時(shí)間實(shí)例代碼

更新時(shí)間：2016年10月23日 11:54:37 投稿：daisy

最近因?yàn)轫?xiàng)目需要，有個(gè)需求是讓實(shí)時(shí)顯示當(dāng)前時(shí)間，然后想想這不簡單嗎，自己就動手敲代碼，但是發(fā)現(xiàn)一個(gè)問題，通過getMonth()得到月份，總是會比當(dāng)前月份少1，深深覺得實(shí)踐出真知啊…之前覺得Date對象挺簡單的，有很多細(xì)節(jié)都沒有注意。下面這篇文章就給大家詳細(xì)介紹下。

前言

這次認(rèn)認(rèn)真真又重新看了相關(guān)內(nèi)容，現(xiàn)把需要注意的地方總結(jié)如下：

1、通過getDay()得到的星期數(shù)是從0開始，0表示星期天，之后從1~6依次表示星期一到星期六；

2、得到日期需使用getDate()而不是getDay() ,因?yàn)榭赡芰?xí)慣性地認(rèn)為日期就是天數(shù)，可能會使用getDay() ，但其實(shí)getDay()是用于得到星期數(shù)的；

3、通過getMonth()得到月份，從0開始計(jì)數(shù)，所以需要再加1。

實(shí)例代碼如下：

<html>
<head>
  <title></title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8">
  <link rel="stylesheet" type="text/css" href="">
  <script type="text/javascript"></script>
  <style type="text/css">
    input{
      width: 200px;
    }
  </style>
</head>
<body>
  <input id="input">
  <script type="text/javascript">
    var in_1 = document.getElementById('input');
    function showTime(){
      var date = new Date();
      var week = date.getDay();
      var weekday;
      switch(week){
        case 0: weekday = '星期天';break;
        case 1: weekday = '星期一';break;
        case 2: weekday = '星期二';break;
        case 3: weekday = '星期三';break;
        case 4: weekday = '星期四';break;
        case 5: weekday = '星期五';break;
        case 6: weekday = '星期六';break;
      }
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var day = date.getDate();
      var hour = date.getHours();
      var minute = date.getMinutes();
      var second = date.getSeconds();
      var in_1 = document.getElementById('input');
      in_1.value = year + '年' + month + "月" + day + '日'+' ' + weekday + ' ' + hour + ':' + minute + ':' + second;
      setTimeout(showTime,1000);
    }
    showTime();
  </script>
</body>
</html>

總結(jié)

以上就是利用JavaScript實(shí)現(xiàn)頁面實(shí)時(shí)顯示時(shí)間的全部內(nèi)容，文中介紹的方法還是很簡單易懂的，非常適合大家學(xué)習(xí)或者直接使用，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流。

您可能感興趣的文章: