Erstellen Sie eine Live-Uhr im Format 00:00

Nov 26 2020

Wie kann man eine Live-Uhr im 00:00- Format erstellen ? Ich habe meinen Code unten angegeben. Gibt es eine Möglichkeit, dies besser oder mit kürzerem Code zu tun?

HTML

<body onload=display_ct();>
<span id='ct'></span>

Jetzt müssen wir nur noch den Javascript-Teil hinzufügen. Dies aktualisiert die Uhr jede Sekunde, so dass es " Live " ist. Außerdem werden Funktionen getMinuteszum Abrufen der aktuellen Uhrzeit verwendet.

Javascript

function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_ct()',refresh)
}
function display_ct() {
var x = new Date()
x1 = x.getHours( )+ ":" +  x.getMinutes();
document.getElementById('ct').innerHTML = x1;
display_c();
 }

Die 1000 Millisekunden können mit mehr oder weniger ausgetauscht werden. 1000 ist gleich 1 Sekunde, was bedeutet, dass 500 ms 0,5 Sekunden wären.

Ich werde meinen Code hier in eine ausführbare Datei aufnehmen:

function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_ct()',refresh)
}
function display_ct() {
var x = new Date()
x1 = x.getHours( )+ ":" +  x.getMinutes();
document.getElementById('ct').innerHTML = x1;
display_c();
 }
<body onload=display_ct();>
<span id='ct'></span>

Antworten

3 firatozcevahir Nov 26 2020 at 14:08

Sie müssen setIntervalanstelle von verwenden setTimeout. Zusätzlich können Sie die padStart()Funktion verwenden, um Ihren stringWerten führende Nullen hinzuzufügen .

Ps: Da Sie nur Stunden und Minuten anzeigen, wird die Uhr jede Minute anstatt alle Sekunden aktualisiert (Funktion läuft immer noch jede Sekunde)

function display_c() {
  var refresh = 1000; // Refresh rate in milli seconds
  mytime = setInterval(display_ct, refresh)
}

function display_ct() {
  var x = new Date()
  x1 = x.getHours().toString().padStart(2,0) + ":" + x.getMinutes().toString().padStart(2,0);
  document.getElementById('ct').innerHTML = x1;
  display_c();
}
<body onload=display_ct();>
  <span id='ct'></span>

1 kernel Nov 26 2020 at 14:16

Machen Sie ein js innerhalb oder außerhalb Ihrer Hauptseite wie folgt

Sie müssen ein Element mit MyClockDisplay als ID für diesen Code haben

    function showTime() {
        var date = new Date();
        var h = date.getHours(); // 0 - 23
        var m = date.getMinutes(); // 0 - 59
        var s = date.getSeconds(); // 0 - 59
        var session = "AM";
        if (h == 0) {
            h = 12;
        }
        if (h > 12) {
            h = h - 12;
            session = "PM";
        }
        h = h < 10 ? "0" + h : h;
        m = m < 10 ? "0" + m : m;
        s = s < 10 ? "0" + s : s;
        var time = h + ":" + m + ":" + s + " " + session;
        document.getElementById("MyClockDisplay").innerText = time;
        document.getElementById("MyClockDisplay").textContent = time;
        setTimeout(showTime, 1000);
    }
    showTime();
<div id="MyClockDisplay"></div>