Wie wird die aktuelle Uhrzeit in JavaScript im Format HH: MM: SS angezeigt?

Können Sie mir bitte sagen, wie ich die Zeit in diesem Format einstellen soll? HH: MM: SS. Ich möchte das in einem Div einstellen?

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 nur mit JavaScript

Aktualisieren

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();
})();

Sie können die native Funktion verwenden Date.toLocaleTimeString():

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

Dies zeigt zB an:

"11:33:01"

Ich habe es auf http://www.w3schools.com/jsref/jsref_tolocaletimestring.asp gefunden

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

Sie können dies in tun Javascript.

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

Zur Zeit kehrt es zurück 15:5:18. Beachten Sie, dass bei einem der Werte unter 10 nur eine Ziffer und nicht zwei angezeigt werden.

Überprüfen Sie dies in JSFiddle

Updates:
Für vorangestellte Nullen versuchen

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

Sie können moment.js verwenden , um dies zu tun.

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

Ausgänge:

16:30:03

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

Beachten Sie, dass toLocaleTimeString () möglicherweise etwas wie zurückgibt 9:00:00 AM.

Verwenden Sie diesen Weg:

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

Ergebnis: 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>

Eine sehr einfache Möglichkeit, moment.js und setInterval zu verwenden .

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

Beispielausgabe

Bei setInterval()Einstellung auf 1000 ms oder 1 Sekunde wird die Ausgabe alle 1 Sekunde aktualisiert.

15:25:50 Uhr

So verwende ich diese Methode bei einem meiner Nebenprojekte.

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

Vielleicht fragen Sie sich, ob die Verwendung setInterval()Leistungsprobleme verursachen würde.

Ist setInterval CPU intensiv?

Ich glaube nicht, dass setInterval von Natur aus erhebliche Leistungsprobleme verursachen wird. Ich vermute, dass der Ruf aus einer früheren Zeit stammt, als die CPUs weniger leistungsfähig waren. ... - einsamer Tag

Nein, setInterval ist an und für sich nicht CPU-intensiv. Wenn viele Intervalle in sehr kurzen Zyklen ausgeführt werden (oder eine sehr komplexe Operation in einem mäßig langen Intervall), kann dies leicht CPU-intensiv werden, je nachdem, was genau Ihre Intervalle tun und wie häufig sie ausgeführt werden. ... - aroth

Aber im Allgemeinen kann die Verwendung von setInterval auf Ihrer Website die Dinge verlangsamen. 20 gleichzeitige Laufintervalle mit mehr oder weniger schwerer Arbeit wirken sich auf die Show aus. Und andererseits ... Sie können wirklich jeden Teil durcheinander bringen, von dem ich denke, dass er kein Problem von setInterval ist. ... - jAndy

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

Das it-ITGebietsschema füllt die Stunde bei Bedarf auf und lässt PM oder AM weg01:33:01

Dieser Code gibt die aktuelle Zeit im HH: MM: SS-Format in der Konsole aus und berücksichtigt GMT-Zeitzonen.

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

Dies ist ein Beispiel für das Festlegen der Zeit in einem div (only_time) mithilfe von 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>