AMとPMで24時間から12時間のタイムスタンプを追加する方法は？

Question

私はリアルタイムで取得するためのコードを以下に作った。しかし、私はどのようにタイムスタンプを24時間から12時間とAM PMに追加するのか分からない。

setInterval(function() { 
 
    var date = new Date(); 
 
    var hours = date.getHours(); 
 
    var seconds = date.getSeconds(); 
 
    var minutes = date.getMinutes(); 
 
    var realTime = (hours < 10 ? '0' : '') + hours + ':' + (minutes < 10 ? '0' : '') + minutes + ':' + (seconds < 10 ? '0' : '') + seconds 
 
    $('#time').html(realTime); 
 
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="time"></div>

Answer 1

を使用してmomentjsとフォーマットを使用することができます

setInterval(function() { 
 
    var date = new Date(); 
 
    var hours = date.getHours(); 
 
    var seconds = ("0" + date.getSeconds()).slice(-2); 
 
    var minutes = ("0" + date.getMinutes()).slice(-2); 
 
    var amPM = hours < 12 ? "AM": "PM"; //decides if this is AM or PM based on hours value 
 
    hours = ("0" + (hours % 12)).slice(-2); //pad 0 prefix 
 
    var realTime = hours + ':' + minutes + ':' + seconds + " " + amPM; //prepare the date format 
 
    $('#time').html(realTime); 
 
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="time"></div>

Answer 2

setInterval(function() { 
 
    var now = moment().format("hh:mm:ss a"); 
 
    $('#time').html(now); 
 
}, 1000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.2/moment.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="time"></div>

あなたは、あなたが（コメントをインライン）このアプローチに従うことができますformat("hh:mm:ss a")

Answer 3

setInterval(function() { 
 
    var date = new Date(); 
 
    var hours = date.getHours(); 
 
    var seconds = date.getSeconds(); 
 
    var minutes = date.getMinutes(); 
 
    if (hours > 12){hours = hours -12; amPM = ' PM'}else{amPM = ' AM'} 
 
    var realTime = (hours < 10 ? '0' : '') + hours + ':' + (minutes < 10 ? '0' : '') + minutes + ':' + (seconds < 10 ? '0' : '') + seconds + amPM 
 
    $('#time').html(realTime); 
 
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="time"></div>