Come aggiornare automaticamente la pagina Web ogni 5 secondi utilizzando JavaScript

In JavaScript, ci sono situazioni in cui è necessario garantire che il contenuto inserito su un determinato sito sia accurato e aggiornato. Ad esempio, è necessario visualizzare i contenuti più recenti su una pagina Web mentre compila un lungo modulo e osservando le nuove modifiche o quando si desidera testare un sito Web. In tali casi, il ritratto automatico di una pagina Web ogni 5 secondi utilizzando JavaScript è molto utile per far fronte a questi tipi di situazioni.

Questo articolo discuterà i metodi per aggiornare automaticamente una pagina Web ogni 5 secondi utilizzando JavaScript.

Come aggiornare automaticamente la pagina Web ogni 5 secondi utilizzando JavaScript?

Per aggiornare automaticamente una pagina Web ogni 5 secondi utilizzando JavaScript, è possibile utilizzare i seguenti approcci:

• "setInterval ()" E "documento.QuerySelector ()"Metodi
• "ricaricare()" metodo
• "setTimeout ()" metodo

Passare attraverso i metodi discussi uno per uno!

Metodo 1: pagina Web di aggiornamento automatico ogni 5 secondi in javascript utilizzando setInterval () e documento.Metodi QuerySelector ()

IL "setInterval ()"Il metodo accede a una funzione a intervallo di tempo specificato e"documento.QuerySelector ()"Il metodo ottiene il primo elemento corrispondente a un selettore CSS. Questi metodi possono essere utilizzati in combinazione per accedere al tag di intestazione specifico e impostare l'intervallo di tempo su una funzionalità richiesta con l'aiuto di un timer.

Sintassi

setInterval (funzione, millisecondi, par1, par2)

Nella sintassi sopra, "funzione"Si riferisce alla funzione a cui è necessario accedere,"millisecondi"È l'intervallo di tempo specifico da eseguire e"par1" E "par2"Sono i parametri aggiuntivi.

documento.QuerySelector (selettori CSS)

Qui, "Selettori CSS"Rappresenta uno o più di un selettore CSS.

Dai un'occhiata al seguente esempio.

Esempio

Innanzitutto, specificare un titolo e un'intestazione in e

Tag, rispettivamente:

Auto Aggiorna la pagina

Ora, imposta un valore del timer come "1":

let timer = 1;

Dopodiché, applica il "setInterval ()Metodo "con un"1000 ms" valore. Questo increverà il timer ogni secondo. Inoltre, accedi all'intestazione specificata per visualizzarla su "Document Object Model (DOM)"Alla fine del valore del timer set.

Infine, itera il valore del timer con l'incremento di "1"Usando"++"Operatore post-incremento e applicare una condizione in modo tale che se il valore supera 5,"posizione.ricaricare()"Il metodo comporterà il ricarico della finestra:

setInterval (() =>
documento.QuerySelector ('H2').InnerText = timer;
timer ++;
if (timer> 5)
posizione.ricaricare();
, 1000);

Si può vedere che la nostra pagina web riceve l'aggiornamento automatico ogni cinque secondi:

Metodo 2: pagina Web di aggiornamento automatico ogni 5 secondi in JavaScript utilizzando l'evento Onload

IL "Onload"L'evento viene attivato quando è stato caricato un oggetto. Questa tecnica può essere implementata per aggiornare la pagina con l'aiuto di una funzione definita dall'utente quando viene caricata la pagina web.

Sintassi

oggetto.onload = refreshpage () myscript;

Nella sintassi data, "funzione"Si riferisce alla funzione che deve essere invocata quando viene caricato l'oggetto.

Guarda il seguente esempio.

Esempio

In primo luogo, includi un titolo e l'intestazione come discusso nel metodo precedente:

Auto Aggiorna la pagina

Ora, applica il "Onload"Evento e invocare la funzione"aggiorna pagina()"E pass"5000"Come argomento che indica l'intervallo di tempo di cinque secondi:

Infine, definisci una funzione chiamata "aggiorna pagina()" con "T"Come argomento che si riferisce al tempo impostato per l'adesione automatica alla pagina Web. IL "posizione.ricaricare()"Il metodo ricaricherà la pagina dopo il tempo specificato:

Funzione AftoPage (t)
setTimeout ("Posizione.ricarica (true); ", t);

Produzione

Metodo 3: pagina Web di aggiornamento automatico ogni 5 secondi in javascript utilizzando setTimeout ()

IL "setTimeout ()"Il metodo invoca una funzione dopo un tempo di impostazione specificata. Questo metodo può essere applicato per ricaricare una pagina Web dopo un timeout impostato specifico.

Sintassi

setTimeout (funzione, millisecondi, par1, par2)

Nella sintassi data, "funzione"Si riferisce alla funzione a cui accedere,"millisecondi"È l'intervallo di tempo specifico da eseguire e"par1","par2"Sono i parametri aggiuntivi.

Esempio

Nel tag script della pagina HTML, applica il “setTimeout ()"Metodo in questo modo quando vengono passati 5 secondi, la posizione.Reload () Metodo ricarica la pagina web:

Produzione

Abbiamo discusso di tutti i metodi convenienti per aggiornare automaticamente una pagina web ogni 5 secondi utilizzando JavaScript.

Conclusione

Per aggiornare automaticamente una pagina Web ogni 5 secondi utilizzando JavaScript, utilizza il “setInterval ()" E "documento.QuerySelector ()"Metodi per regolare il valore del timer, il"ricaricare()"Metodo per rinfrescare una pagina Web o"setTimeout ()"Metodo per l'impostazione di un limite di aggiornamento del timeout specifico di una pagina Web. Questo articolo ha dimostrato i metodi per aggiornare automaticamente una pagina Web ogni 5 secondi utilizzando JavaScript.