Heim > Web-Frontend > js-Tutorial > Hauptteil

Timer-Nutzung von setTimeOut und setInterval in Javascript_Javascript-Kenntnissen

WBOY
Freigeben: 2016-05-16 15:55:31
Original
1462 Leute haben es durchsucht

Die Funktionen setTimeOut und setInterval von Javascript werden häufig verwendet, um verzögerte und geplante Aufgaben zu verarbeiten. Nach dem Öffnen einer Webseite wird beispielsweise für einen bestimmten Zeitraum eine Anmeldebox angezeigt, und die Seite sendet asynchrone Anforderungen zum Abrufen aktuelle Daten in regelmäßigen Abständen usw. Aber ihre Anwendungen sind unterschiedlich.

Die setTimeout()-Methode wird verwendet, um eine Funktion oder einen berechneten Ausdruck nach einer angegebenen Anzahl von Millisekunden aufzurufen, während setInterval() eine Schleife durchläuft, um eine Funktion oder einen Ausdruck alle angegebene Anzahl von Millisekunden aufzurufen, bis clearInterval sie löscht. Mit anderen Worten, setTimeout() wird nur einmal ausgeführt und setInterval() kann mehrmals ausgeführt werden. Die Parameter der beiden Funktionen sind ebenfalls gleich. Der erste Parameter ist der auszuführende Code oder Handle, und der zweite Parameter ist die Anzahl der zu verzögernden Millisekunden.
setTimeOut-Nutzung
Die Verwendung der setTimeout-Funktion ist wie folgt:

Code kopieren Der Code lautet wie folgt:

var timeoutID = window.setTimeout(func, [delay, param1, param2, ...]); var timeoutID = window.setTimeout(code, [delay]);

timeoutID: Timer-ID-Nummer, die zum Löschen des Timers in der Funktion „clearTimeout()“ verwendet werden kann.

func: die ausgeführte Funktion.
Code: (alternative Syntax) eine Codezeichenfolge, die ausgeführt werden soll.
Verzögerung: Verzögerungszeit in Millisekunden. Wenn nicht angegeben, ist der Standardwert 0.

Wir können window.setTimeout oder setTimeout verwenden. Die beiden Schreibmethoden sind grundsätzlich gleich, außer dass window.setTimeout auf die Funktion setTimeout als Eigenschaft des globalen Fensterobjekts verweist.

Anwendungsbeispiel:

Code kopieren Der Code lautet wie folgt:
Funktion Timeout(){
Document.getElementById('res').innerHTML=Math.floor(Math.random()*100 1); }
setTimeout("timeout()",5000);


Wenn der Code ausgeführt wird, wird die Funktion timeout() nach 5 Sekunden aufgerufen. Klicken Sie hier, um die Demonstration anzusehen.
setInterval-Nutzung Die Parameter und die Verwendung der Funktion setInterval sind die gleichen wie bei der Funktion setTimeout. Weitere Informationen finden Sie oben in der Einführung zur Verwendung der Funktion setTimeout. Der Unterschied besteht darin, dass setInterval den Funktions- oder Codecode in regelmäßigen Abständen ausführt.

Anwendungsbeispiel:


Code kopieren Der Code lautet wie folgt: var tt = 10;
Funktion timego(){
tt--;
Document.getElementById("tt").innerHTML =
If(tt==0){
           window.location.href='/';          return false;
}
}
var timer = window.setInterval("timego()",1000);


Die Funktion timego() definiert den vom Seitenelement #tt angezeigten Inhalt. Wenn tt gleich 0 ist, wird die Seite auf die Startseite weitergeleitet. Dann definieren wir einen Timer-Timer und rufen mit setInterval() jede Sekunde timego() auf. Auf diese Weise wird timego zehnmal ausgeführt und jedes Mal wird die Zahl tt um 1 reduziert, bis sie 0 ist. Wenn Sie dann den Timer stoppen möchten, können Sie den folgenden Code verwenden:

Code kopieren

Der Code lautet wie folgt: window.clearInterval(timer);
Wenn der Code ausgeführt wird, springt die Seite nach 10 Sekunden zur Startseite

Tatsächlich kann setTimeout() eine Funktion auch wiederholt in regelmäßigen Abständen ausführen, aber wir verwenden setTimeOut und setInterval einfach immer noch unterschiedlich. Darüber hinaus wird JavaScript in der JavaScript-Engine des Browsers in einer Single-Thread-Methode ausgeführt. In tatsächlichen Anwendungen müssen komplexe Aufgaben in die Warteschlange gestellt werden, was zu ungenauen Timern führen kann Der Artikel führt keine gründliche Recherche durch.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage