Hvordan du automatisk oppdaterer websiden hvert 5. sekund ved hjelp av JavaScript

I JavaScript er det situasjoner når vi trenger å sikre at innholdet av innholdet på et bestemt nettsted er nøyaktig og oppdatert. For eksempel er det påkrevd å vise det nyeste innholdet på en webside mens du fyller ut en lang form og observerer de nye endringene eller når du vil teste et nettsted. I slike tilfeller er det veldig nyttig å rette opp en webside hvert 5. sekund ved bruk av JavaScript.

Denne artikkelen vil diskutere metodene for å automatisk oppdatere en webside hvert 5. sekund ved hjelp av JavaScript.

Hvordan du automatisk oppdaterer websiden hvert 5. sekund ved hjelp av JavaScript?

For å automatisk oppdatere en webside hvert 5. sekund ved hjelp av JavaScript, kan følgende tilnærminger brukes:

• “setInterval ()”Og“dokument.QuerySelector ()”Metoder
• “forfriske()”Metode
• “setTimeout ()”Metode

Gå gjennom de diskuterte metodene en etter en!

Metode 1: Auto Refresh webside hvert 5. sekund i JavaScript ved hjelp av SetInterval () og dokument.QuerySelector () Metoder

“setInterval ()”Metode får tilgang til en funksjon ved spesifisert tidsintervall og“dokument.QuerySelector ()”Metoden får det første elementet som samsvarer med en CSS -velger. Disse metodene kan brukes i kombinasjon for å få tilgang til den spesifikke overskriften og angi tidsintervallet til en nødvendig funksjonalitet ved hjelp av en tidtaker.

Syntaks

SetInterval (funksjon, millisekunder, par1, par2)

I syntaks ovenfor, "funksjon”Henviser til funksjonen som må nås,”millisekunder”Er det spesifikke tidsintervallet å utføre, og“par1”Og“par2”Er tilleggsparametrene.

dokument.QuerySelector (CSS Selectors)

Her, “CSS -velgere”Representere en eller flere enn en CSS -velgere.

Sjekk ut følgende eksempel.

Eksempel

Først, spesifiser en tittel og en overskrift i og

henholdsvis tagger:

Auto oppdater siden

Sett nå en timerverdi som "1”:

La Timer = 1;

Etter det, bruk "setInterval ()”Metode med en“1000ms”Verdi. Dette vil øke tidtakeren hvert sekund. Få tilgang til den spesifiserte overskriften for å vise den på “Document Object Model (DOM)”På slutten av den angitte timerverdien.

Til slutt itererer verdien av tidtakeren med økningen av “1" ved hjelp av "++”Post-increment-operatør og bruk en tilstand på en slik måte at hvis verdien overstiger 5,“plassering.Last inn () på nytt”Metoden vil resultere i omlasting av vinduet:

setInterval (() =>
dokument.QuerySelector ('H2').Innertext = Timer;
Timer ++;
if (timer> 5)
plassering.Reload ();
, 1000);

Det kan sees at websiden vår får automatisk oppdatering hvert femte sekund:

Metode 2: Auto Refresh webside hvert 5. sekund i JavaScript ved hjelp av Onload -arrangement

“på Last”Arrangementet utløses når et objekt er lastet. Denne teknikken kan implementeres for å oppdatere siden ved hjelp av en brukerdefinert funksjon når websiden er lastet inn.

Syntaks

gjenstand.onload = RefreshPage () MyScript;

I den gitte syntaksen, “funksjon”Refererer til funksjonen som må påberopes når objektet er lastet.

Se på følgende eksempel.

Eksempel

Først, inkluder en tittel og overskrift som diskutert i forrige metode:

Auto oppdater siden

Nå, bruk “på Last”Hendelse og påkalle funksjonen”Oppdater side()”Og pass“5000”Som argument som indikerer fem sekunders tidsintervall:

Til slutt, definer en funksjon som heter “Oppdater side()”Med“t”Som et argument som refererer til den angitte tiden for automatisk forfriskende websiden. “plassering.Last inn () på nytt”Metoden lastes inn på siden etter den spesifiserte tiden:

funksjon RefreshPage (t)
setTimeout ("beliggenhet.Last inn (true); ", t);

Produksjon

Metode 3: Auto Refresh webside hvert 5. sekund i JavaScript ved hjelp av Settimeout () -metode

“setTimeout ()”Metode påkaller en funksjon etter en spesifisert angitt tid. Denne metoden kan brukes for å laste inn en webside på nytt etter en bestemt fast timeout.

Syntaks

setTimeout (funksjon, millisekunder, par1, par2)

I den gitte syntaksen, “funksjon”Henviser til funksjonen som skal nås,”millisekunder”Er det spesifikke tidsintervallet å utføre, og“par1”,“par2”Er tilleggsparametrene.

Eksempel

I skriptetoden til HTML -siden, bruk "setTimeout ()”Metode på en slik måte når 5 sekunder blir passert, stedet.Reload () Metode Last inn websiden på nytt:

Produksjon

Vi har diskutert alle de praktiske metodene for å automatisk oppdatere en webside hvert 5. sekund ved hjelp av JavaScript.

Konklusjon

For å automatisk oppdatere en webside hvert 5. sekund ved å bruke JavaScript, bruk "setInterval ()”Og“dokument.QuerySelector ()”Metoder for å justere timerverdien,“forfriske()”Metode for å oppdatere en webside, eller“setTimeout ()”Metode for å sette en spesifikk timeout -oppdateringsgrense for en webside. Denne artikkelen demonstrerte metodene for å automatisk oppdatere en webside hvert 5. sekund ved hjelp av JavaScript.