Come mostrare l'ora corrente in JavaScript nel formato HH: MM: SS?

Puoi dirmi come impostare l'ora in questo formato HH: MM: SS. Voglio impostarlo in un div?

function checkTime(i) {
  if (i < 10) {
    i = "0" + i;
  }
  return i;
}

function startTime() {
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var s = today.getSeconds();
  // add a zero in front of numbers<10
  m = checkTime(m);
  s = checkTime(s);
  document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
  t = setTimeout(function() {
    startTime()
  }, 500);
}
startTime();

<div id="time"></div>

DEMO utilizzando solo javaScript

Aggiornare

Updated Demo

(function () {
    function checkTime(i) {
        return (i < 10) ? "0" + i : i;
    }

    function startTime() {
        var today = new Date(),
            h = checkTime(today.getHours()),
            m = checkTime(today.getMinutes()),
            s = checkTime(today.getSeconds());
        document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
        t = setTimeout(function () {
            startTime()
        }, 500);
    }
    startTime();
})();

Puoi usare la funzione nativa Date.toLocaleTimeString():

var d = new Date();
var n = d.toLocaleTimeString();

Questo mostrerà ad esempio:

"11:33:01"

L'ho trovato su http://www.w3schools.com/jsref/jsref_tolocaletimestring.asp

var d = new Date();
var n = d.toLocaleTimeString();
alert("The time is: \n"+n);

Puoi farlo in Javascript.

var time = new Date();
console.log(time.getHours() + ":" + time.getMinutes() + ":" + time.getSeconds());

Attualmente ritorna 15:5:18. Si noti che se uno qualsiasi dei valori è inferiore a 10, verrà visualizzato utilizzando solo una cifra, non due.

Controlla questo in JSFiddle

Aggiornamenti:
per provare con 0 prefissati

var time = new Date();
console.log(
    ("0" + time.getHours()).slice(-2)   + ":" + 
    ("0" + time.getMinutes()).slice(-2) + ":" + 
    ("0" + time.getSeconds()).slice(-2));

Puoi usare moment.js per farlo.

var now = new moment();
console.log(now.format("HH:mm:ss"));

Uscite:

16:30:03

new Date().toTimeString().slice(0,8)

Nota che toLocaleTimeString () potrebbe restituire qualcosa di simile 9:00:00 AM.

Usa in questo modo:

var d = new Date();
localtime = d.toLocaleTimeString('en-US', { hour12: false });

Risultato: 18:56:31

function realtime() {
  
  let time = moment().format('h:mm:ss a');
  document.getElementById('time').innerHTML = time;
  
  setInterval(() => {
    time = moment().format('h:mm:ss a');
    document.getElementById('time').innerHTML = time;
  }, 1000)
}

realtime();

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>

<div id="time"></div>

Un modo molto semplice utilizzando moment.js e setInterval .

setInterval(() => {
  moment().format('h:mm:ss a');
}, 1000)

Output di esempio

Utilizzando setInterval()impostato su 1000 ms o 1 secondo, l'uscita si aggiornerà ogni 1 secondo.

15:25:50

È così che utilizzo questo metodo in uno dei miei progetti collaterali.

setInterval(() => {
  this.time = this.shared.time;
}, 1000)

Forse ti stai chiedendo se stai usando setInterval() potrebbe causare alcuni problemi di prestazioni.

SetInterval è impegnativo per la CPU?

Non credo che setInterval causi intrinsecamente problemi di prestazioni significativi. Sospetto che la reputazione possa derivare da un'epoca precedente, quando le CPU erano meno potenti. ... - lonesomeday

No, setInterval non è intensivo per la CPU in sé e per sé. Se hai molti intervalli in esecuzione su cicli molto brevi (o un'operazione molto complessa in esecuzione su un intervallo moderatamente lungo), allora ciò può facilmente diventare intensivo per la CPU, a seconda esattamente di ciò che stanno facendo i tuoi intervalli e della frequenza con cui lo fanno. ... - aroth

Ma in generale, usare setInterval piace molto sul tuo sito può rallentare le cose. 20 intervalli simultanei in esecuzione con un lavoro più o meno pesante influenzeranno lo spettacolo. E poi di nuovo .. puoi davvero rovinare qualsiasi parte immagino che non sia un problema di setInterval. ... - jAndy

new Date().toLocaleTimeString('it-IT')

Le it-ITimpostazioni internazionali riempiono l'ora se necessario e omettono PM o AM01:33:01

Questo codice produrrà l'ora corrente nel formato HH: MM: SS nella console, tiene conto dei fusi orari GMT.

var currentTime = Date.now()
var GMT = -(new Date()).getTimezoneOffset()/60;
var totalSeconds = Math.floor(currentTime/1000);
seconds = ('0' + totalSeconds % 60).slice(-2);
var totalMinutes = Math.floor(totalSeconds/60);
minutes = ('0' + totalMinutes % 60).slice(-2);
var totalHours = Math.floor(totalMinutes/60);
hours = ('0' + (totalHours+GMT) % 24).slice(-2);
var timeDisplay = hours + ":" + minutes + ":" + seconds;
console.log(timeDisplay);
//Output is: 11:16:55

Questo è un esempio di come impostare l'ora in un div (only_time) utilizzando javascript.

function date_time() {
    var date = new Date();
    var am_pm = "AM";
    var hour = date.getHours();
    if(hour>=12){
        am_pm = "PM";
    }
    if (hour == 0) {
        hour = 12;
    }
    if(hour>12){
        hour = hour - 12;
    }
    if(hour<10){
        hour = "0"+hour;
    }

    var minute = date.getMinutes();
    if (minute<10){
        minute = "0"+minute;
    }
    var sec = date.getSeconds();
    if(sec<10){
        sec = "0"+sec;
    }

    document.getElementById("time").innerHTML =  hour+":"+minute+":"+sec+" "+am_pm;
}
setInterval(date_time,500);
<per>
<div class="date" id="time"></div>
</per>