JavaScript-Lösung für die Setinterval-Verzögerung um eine Sekunde

JavaScript-Lösung für die Setinterval-Verzögerung um eine Sekunde

Bei Verwendung von setinterval wird festgestellt, dass es nach einer Verzögerung von einer Sekunde ausgeführt wird, wenn die Seite gerade geöffnet wurde. Da der Setinterval-Timer zuerst seine eigene Sekunde ausführt und dann den darin enthaltenen Inhalt verarbeitet, wird er nicht sofort angezeigt.

Beispiel: Erstellen Sie zuerst eine Div-Box und schreiben Sie dann den Skriptcode

var div = document.querySelector('div');
			varnum = 10;
			setzeIntervall(Funktion(){
				wenn(num==1){
					div.innerHTML = null;
					fn1 zurückgeben;
				}anders{
					Nummer--;
					div.innerHTML = 'Verbleibend' + num + 'Sekunden';
				}
			},1000);

Der Effekt ist wie unten dargestellt:

Es wird zuerst für diese Sekunde ausgeführt, wartet eine Sekunde und führt dann den darin angezeigten Inhalt aus

Lösung:

Direktanruf

var div = document.querySelector('div');
			Variable Nummer = 11;
			Funktion fn1(){
				wenn(num==1){
					div.innerHTML = null;
					fn1 zurückgeben;
				}anders{
					Nummer--;
					div.innerHTML = 'Verbleibend' + num + 'Sekunden';
				}
			}
			setzeInterval(fn1,1000);
			fn1();

Dies ist das Ende dieses Artikels über die Lösung für die einsekündige Verzögerung des JavaScript-Setintervals. Weitere Informationen zur Lösung für die einsekündige Verzögerung des JavaScript-Setintervals finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

Das könnte Sie auch interessieren:
  • Allgemeine Array-Operationen in JavaScript
  • Eine einfache und eingehende Studie zu Async und Await in JavaScript
  • JavaScript-Implementierung des klassischen Schlangenspiels
  • Javascript-Grundlagen zu integrierten Objekten
  • Detaillierte Erläuterung des JavaScript-Betriebsmechanismus und eine kurze Diskussion über Event Loop
  • Vergleich zwischen Python-Coroutinen und JavaScript-Coroutinen
  • JavaScript zum Erreichen eines Mouse-Tailing-Effekts
  • JavaScript zum Erzielen eines einfachen Drag-Effekts
  • Detaillierte Erklärung der JavaScript-Array-Deduplizierung
  • JavaScript zur Implementierung des Flugzeugkriegsspiels
  • Detaillierte Erläuterung des Falls des JavaScript-Upload-Dateilimitparameters
  • Ein kurzer Vortrag über die Variablenförderung in JavaScript
  • Tiefgreifendes Verständnis des Ereignisausführungsmechanismus von JavaScript
  • 8 wichtige JavaScript-Codefragmente für Ihr Projekt

<<:  Grundlegende Anweisungen der MySQL-Datendefinitionssprache DDL

>>:  Analyse des Implementierungsprozesses für die Tomcat maxPostSize-Einstellung

Artikel empfehlen

Vue Element UI-Komponente für benutzerdefinierte Beschreibungsliste

In diesem Artikelbeispiel wird der spezifische Co...

Erkunden Sie die gängigen VMware ESXI CLI-Befehle

Inhaltsverzeichnis 【Allgemeine Befehle】 [Zusammen...

Docker legt Port 2375 frei, was zu Serverangriffen und -lösungen führt

Ich glaube, dass Studenten, die etwas über die Do...

So implementieren Sie Hot Deployment und Hot Start in Eclipse/Tomcat

1. Hot Deployment: Das bedeutet, das gesamte Proj...

Schritte zum Erstellen eines Docker-Images mit Dockerfile

Dockerfile ist eine Textdatei, die Anweisungen en...

Layout im Vue.js-Stil Allgemeine Fähigkeiten zur Flutter-Geschäftsentwicklung

Korrespondenz zwischen Flutter und CSS im Shadow-...

vue.js lädt Bilder entsprechend der Bild-URL herunter

Als ich kürzlich an einem Frontend-Docking-Funkti...

nuxt.js Konfiguration mehrerer Umgebungsvariablen

Inhaltsverzeichnis 1. Einleitung 2. Szenario 3. S...

Ausführliche Erläuterung der Auswirkungen von NULL auf Indizes in MySQL

Vorwort Ich habe viele Blogs gelesen und von viel...

Anfänger lernen einige HTML-Tags (3)

Anfänger, die mit HTML in Berührung kommen, lerne...

CSS Sticky Footer-Implementierungscode

Dieser Artikel stellt den Implementierungscode fü...

So verschieben Sie den Datenspeicherort von mysql5.7.19 in Centos7

Szenario: Mit zunehmender Datenmenge ist die Fest...

Detaillierte Erklärung der React-Ereignisbindung

1. Was ist In react Anwendungen werden Ereignisna...