So automatische Aktualisierung der Webseite alle 5 Sekunden mit JavaScript automatisch aktualisieren

In JavaScript gibt es Situationen, in denen wir sicherstellen müssen, dass der eingegebene Inhalt auf einer bestimmten Website korrekt und aktuell ist. Beispielsweise ist es erforderlich, den neuesten Inhalt auf einer Webseite anzuzeigen, während ein langwieriges Formular ausgefüllt und die neuen Änderungen beobachtet werden oder wenn Sie eine Website testen möchten. In solchen Fällen ist es sehr hilfreich, mit diesen Situationen eine Webseite mit JavaScript mit JavaScript umzusetzen, um eine Webseite zu freieren.

In diesem Artikel werden die Methoden besprochen, um eine Webseite alle 5 Sekunden mit JavaScript automatisch zu aktualisieren.

So automatische Aktualisierung der Webseite alle 5 Sekunden mit JavaScript automatisch aktualisieren?

Um eine Webseite alle 5 Sekunden mit JavaScript automatisch zu aktualisieren, können die folgenden Ansätze verwendet werden:

• “setInterval ()" Und "dokumentieren.QuerySelector ()”Methoden
• “Aktualisierung()" Methode
• “setTimeout ()" Methode

Gehen Sie die diskutierten Methoden nacheinander durch!

Methode 1: Die Webseite automatisch aktualisieren alle 5 Sekunden in JavaScript mit SetInterval () und Dokument.QuerySelector () Methoden

Der "setInterval ()Die Methode greift auf eine Funktion im bestimmten Zeitintervall und auf die “zugreift“dokumentieren.QuerySelector ()Die Methode erhält das erste Element, das einem CSS -Selektor entspricht. Diese Methoden können in Kombination verwendet werden, um auf das spezifische Überschriften -Tag zuzugreifen und das Zeitintervall mit Hilfe eines Timers auf eine erforderliche Funktionalität einzustellen.

Syntax

setInterval (Funktion, Millisekunden, Par1, PAR2)

In der obigen Syntax “,“Funktion"Bezieht sich auf die Funktion, auf die zugegriffen werden muss"Millisekunden"Ist das spezifische Zeitintervall, das auszuführen ist und"par1" Und "par2”Sind die zusätzlichen Parameter.

dokumentieren.QuerySelector (CSS -Selektoren)

Hier, "CSS -Selektoren„Ein oder mehr als ein CSS -Selektoren darstellen.

Schauen Sie sich das folgende Beispiel an.

Beispiel

Geben Sie zunächst einen Titel und einen Übergang in der und an und

Tags: jeweils Tags:

Automatisch die Seite automatisch aktualisieren

Stellen Sie nun einen Timerwert als "fest1”:

Timer = 1;

Danach anwenden Sie die “setInterval ()"Methode mit einer"1000 ms" Wert. Dies erhöht den Timer jede Sekunde. Greifen Sie außerdem auf die angegebene Überschrift zu, um sie auf der “anzuzeigenDokumentobjektmodell (DOM)”Am Ende des festgelegten Timerwerts.

Schließlich den Wert des Timers mit dem Inkrement von “iterieren1"Verwenden"++”Nach der Inkrementbetreiber und eine Bedingung so anwenden, dass der Wert, wenn der Wert 5 überschreitet, die“Standort.neu laden()Die Methode führt zum Nachladen des Fensters:

setInterval (() =>
dokumentieren.QuerySelector ('H2').InnerText = Timer;
Timer ++;
if (Timer> 5)
Standort.neu laden();
, 1000);

Es ist zu sehen, dass unsere Webseite alle fünf Sekunden automatisch aktualisiert wird:

Methode 2: WEB -Seite automatisch aktualisieren alle 5 Sekunden im JavaScript mit Onload -Ereignis

Der "OnloadEreignis wird ausgelöst, wenn ein Objekt geladen wurde. Diese Technik kann implementiert werden, um die Seite mit Hilfe einer benutzerdefinierten Funktion zu aktualisieren, wenn die Webseite geladen wird.

Syntax

Objekt.onload = refreshpage () myScript;

In der gegebenen Syntax “,“Funktion”Bezieht sich auf die Funktion, die aufgerufen werden muss, wenn das Objekt geladen wird.

Schauen Sie sich das folgende Beispiel an.

Beispiel

Geben Sie zunächst einen Titel und eine Überschrift an, wie in der vorherigen Methode erläutert:

Automatisch die Seite automatisch aktualisieren

Wenden Sie nun das an “anOnloadEreignis und rufen Sie die Funktion auf "Seite neu laden()"Und passieren"5000”Als Argument, das ein Zeitintervall von fünf Sekunden anzeigt:

Schließlich definieren Sie eine Funktion namens “Seite neu laden()" mit "T”Als Argument, das sich auf die festgelegte Zeit für die automatische Aktualisierung der Webseite bezieht. Der "Standort.neu laden()Die Methode laden die Seite nach der angegebenen Zeit neu:

Funktion refreshpage (t)
setTimeout ("Ort.neu laden (wahr); ", t);

Ausgang

Methode 3: WEBseite automatisch aktualisieren alle 5 Sekunden in JavaScript mit setTimeout () Methode

Der "setTimeout ()Die Methode ruft nach einer bestimmten festgelegten Zeit eine Funktion auf. Diese Methode kann angewendet werden, um eine Webseite nach einem bestimmten festgelegten Zeitübergang neu zu laden.

Syntax

setTimeout (Funktion, Millisekunden, Par1, Par2)

In der gegebenen Syntax “,“Funktion"Bezieht sich auf die zugegriffene Funktion"Millisekunden"Ist das spezifische Zeitintervall, das auszuführen ist und"par1","par2”Sind die zusätzlichen Parameter.

Beispiel

Wenden Sie im Skript -Tag der HTML -Seite die “ansetTimeout ()Methode so, wenn 5 Sekunden übergeben werden, der Ort.RELOAD () Methode lädt die Webseite neu:

Ausgang

Wir haben alle bequemen Methoden besprochen, um eine Webseite alle 5 Sekunden mit JavaScript automatisch zu aktualisieren.

Abschluss

Verwenden Sie die “, um eine Webseite alle 5 Sekunden mit JavaScript automatisch zu aktualisierensetInterval ()" Und "dokumentieren.QuerySelector ()"Methoden zum Anpassen des Timerwerts", den "Aktualisierung()Methode zum Aktualisieren einer Webseite oder der “setTimeout ()Methode zum Festlegen einer bestimmten Zeitlimit -Aktualisierungsgrenze einer Webseite. Dieser Artikel hat die Methoden gezeigt, um eine Webseite alle 5 Sekunden mit JavaScript automatisch zu aktualisieren.