JavaScript Timing Ereignisse

JavaScript kann in Zeitintervallen ausgeführt werden.

Das ist das sogenannte Zeitgesteuerte Ereignis (Timing Events).

Timing-Events

Das Window-Objekt ermöglicht die Ausführung von Code zu bestimmten Zeitintervallen.

Diese Zeitintervalle werden als Timing-Events bezeichnet.

sind zwei Schlüsselmethoden, die mit JavaScript verwendet werden:

setTimeout(function, Millisekunden)
führt die Funktion nach der angegebenen Millisekunden-Wartezeit aus.
setInterval(function, Millisekunden)
entspricht setTimeout(), aber führt die Funktion fortlaufend aus.

setTimeout() und setInterval()-Methode gehören alle Methoden des HTML DOM Window-Objekts.

setTimeout() Methode

window.setTimeout(function, Millisekunden);

window.setTimeout() die Methode kann ohne window mit Präfix zu schreiben.

Der erste Parameter ist die auszuführende Funktion.

Der zweite Parameter gibt die Anzahl der Millisekunden an, die vor der Ausführung erwartet werden.

Beispiel

Klicken Sie auf die Schaltfläche. Warten Sie 3 Sekunden, dann wird die Seite "Hello" ausgeben:

<button onclick="setTimeout(myFunction, 3000)">Versuchen Sie es</button>
<script>
function myFunction() {
    alert('Hello');
 }
</script>

Versuchen Sie es selbst

Wie kann die Ausführung gestoppt werden?

verwenden Methode stoppt die Ausführung setTimeout() vorgeschriebene Funktion.

window.clearTimeout(timeoutVariable)

window.clearTimeout() die Methode kann ohne window mit Präfix zu schreiben.

verwenden von setTimeout() Rückgegebene Variable:

myVar = setTimeout(function, Millisekunden);
clearTimeout(myVar);

Beispiel

Wie im obigen Beispiel, aber mit einem "Stop"-Knopf hinzugefügt:

<button onclick="myVar = setTimeout(myFunction, 3000)">Versuchen Sie es</button>
<button onclick="clearTimeout(myVar)">Ausführung stoppen</button>

Versuchen Sie es selbst

setInterval() Methode

setInterval()-Methode die Methode wiederholt die angegebene Funktion zu jedem angegebenen Zeitintervall.

window.setInterval(function, Millisekunden);

window.setInterval() die Methode kann ohne window mit Präfix zu schreiben.

Der erste Parameter ist die auszuführende Funktion.

Der zweite Parameter gibt die Länge der Zeitintervalle zwischen den Ausführungen an.

In diesem Beispiel wird die Funktion "myTimer" jede Sekunde ausgeführt (wie ein digitaler Taschenuhr).

Beispiel

Zeige die aktuelle Zeit:

var myVar = setInterval(myTimer, 1000);
function myTimer() {
    var d = new Date();
    document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}

Versuchen Sie es selbst

Eine Sekunde hat 1000 Millisekunden.

Wie kann die Ausführung gestoppt werden?

clearInterval()-Methode Methode stoppen setInterval()-Methode ausgeführte Funktion im angegebenen Methodenaufruf.

window.clearInterval(timerVariable)

window.clearInterval() ohne Prefix "window" geschrieben.

clearInterval()-Methode Die Methode wird mit setInterval()-Methode Rückgegebene Variable:

myVar = setInterval(function, Millisekunden);
clearInterval(myVar);

Beispiel

Wie im obigen Beispiel, aber wir fügen einen "Zeit stoppen"-Knopf hinzu:

<p id="demo"></p>
<button onclick="clearInterval(myVar)">Zeit stoppen</button>
<script>
var myVar = setInterval(myTimer, 1000);
 function myTimer() {
    var d = new Date();
    document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
</script>

Versuchen Sie es selbst

Mehr Beispiele

Ein weiterer einfacher Zeitmesser
Von der Zeitmaschine erstellte Uhr