読者です 読者をやめる 読者になる 読者になる

moment.js でリアルタイムに日付時刻を表示

moment.js でリアルタイムに日付時刻を表示する。

jQuery と moment-with-locales.js を使う。

<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/moment-with-locales.js"></script>
<div>
   <h1 id="date"></h1>
   <h2 id="hour_min_sec"></h2>
</div>

自分で clock関数、1秒間隔実行を用意して実行する。

$(function(){
   moment.updateLocale("ja",
         { weekdays: ["日曜日","月曜日","火曜日","水曜日","木曜日","金曜日","土曜日"],
            weekdaysShort: ["日","月","火","水","木","金","土"], }
   );

   var clock = function(){
      var m = moment();
      setTimeout(clock, 1000);
      /* 表示。極力他の処理をやらない */
      $('#date').html(m.format("YYYY年 M月 D日 (ddd)")),
      $('#hour_min_sec').html(m.format("HH:mm:ss"));
   }
   clock();
});

ミリ秒、マイクロ秒の単位まで精度を求めないならこれで充分。