JavaScript Vent til at siden lastes inn

Nettsidene eller nettstedene du besøker lar brukeren ofte vente på å vise en viktig melding eller en advarsel før du får tilgang til en bestemt komponent. For eksempel, når du ber en bruker om å kjøpe medlemskap eller innlogging før du får tilgang til nettstedets innhold eller for riktig trafikkstyring i tilfelle utdanningsnettsteder. I slike tilfeller kan du la brukeren vente på en side til den blir lastet.

Denne bloggen vil diskutere metodologiene som kan brukes til å angi sidelasttid i JavaScript.

Hvordan vente på at en side skal laste inn JavaScript?

Du kan vente til en side laster inn i JavaScript ved å bruke følgende tilnærminger:

• • Vinduet Onload -arrangement med "setTimeout ()”Metode
  • Vinduet Onload -arrangement med "setInterval ()”Metode
  • “AddEventListener ()”Metode

De nevnte konseptene vil bli demonstrert en etter en!

Metode 1: Vent til siden lastes inn i JavaScript ved å bruke vindu.Onload -arrangement med Settimeout () -metode

“vindu.på Last”Hendelsen oppstår når vinduet er lastet, og“setTimeout ()”Metode påkaller en funksjon etter den spesifiserte settetiden. Mer spesifikt kan disse tilnærmingene kombineres for å laste vinduet etter den spesifiserte ventetiden.

Syntaks

setTimeout (funksjon, millisekunder)

I den gitte syntaks refererer funksjonen til den tilgjengelige funksjonen “Waitload ()”, Og millisekunder indikerer“Sett tid”I millisekunder.

Det undergitte eksemplet demonstrerer det uttalte konseptet.

Eksempel

For det første, bruk "vindu.på Last”Arrangement sammen med“setTimeout ()”Metode for å laste vinduet etter den angitte tiden i millisekunder. Den spesifiserte ventetiden vil bli brukt på ventelast () -funksjonen:

vindu.onload = setTimeout (Waitload, 3000)

Nå, definer funksjonen som heter “Waitload ()”I taggen. Denne spesielle funksjonen vil nås på vindusbelastningen og varsle brukeren med følgende meldinger via varsel og på henholdsvis dokumentobjektsmodellen (DOM):

funksjon waitload ()
Varsel ("Lastet!")
dokument.Skriv ("Denne siden er lastet nå!")
;

Det kan observeres at siden er lastet etter den spesifiserte 3 sekunders ventetid:

Hvis du vil laste siden etter en spesifisert ventetid gjentatte ganger, bruk følgende metode.

Metode 2: Vent til siden lastes inn i JavaScript ved hjelp av vindu.Onload -arrangement med SetInterval () -metode

“vindu.på Last”, Som omtalt ovenfor, utløses når vinduet er lastet. “setInterval ()”Metode får tilgang til en spesifisert funksjon gjentatte ganger med de spesifiserte tidsintervallene beregnet i millisekunder.

Syntaks

setInterval (funksjon, millisekunder)

Her, "funksjon”Refererer til funksjonen som må utføres og“millisekunder”Er det faste tidsintervallet.

Eksempel

I det følgende eksempel vil vi sette tidsintervallet som argument i den definerte funksjonen. Skriv ut en spesifikk melding via et varsel på DOM etter hvert tredje sekund når siden blir lastet gjentatte ganger:

vindu.onload = setInterval (funksjon ()
Varsel ("Lastet!")
dokument.Skriv ("Denne siden er lastet nå!")
, 3000);

Produksjon

I den ekstraherte utgangen er det tydelig at siden er lastet gjentatte ganger etter den spesifiserte ventetiden.

Metode 3: Vent til siden lastes inn i JavaScript ved hjelp av AddEventListener () -metode

“AddEventListener ()”Metode bruker en hendelsesbehandler på dokumentet. Denne metoden kan implementeres for å legge ved en bestemt hendelse og laste siden når du klikker hvor som helst i DOM.

Syntaks

dokument.AddEventListener (hendelse, funksjon)

I den gitte syntaksen, “begivenhet”Henviser til hendelsen som vil bli utløst, og“funksjon”Peker på funksjonen som utfører en viss funksjonalitet på den utløste hendelsen.

Eksempel

Først vil vi legge ved en hendelse “Klikk”Til dokumentet ved hjelp av AddEventListener () -metoden. Når du utløser den spesifiserte hendelsen, er funksjonen som heter “Waitload ()”Vil bli henrettet:

dokument.AddEventListener ("Klikk", Waitload)

Definere funksjonen “Waitload ()”Der viser følgende melding på DOM på den utløste hendelsen:

funksjon waitload ()
dokument.Skriv ("Siden er lastet nå!");

I denne spesielle utgangen lastes siden når du klikker på markøren hvor som helst på DOM:

Vi har samlet forskjellige metoder for å vente på at siden laster.

Konklusjon

For å vente med å laste inn en side i JavaScript, bruk vindu.på Last arrangement med “setTimeout ()”Metode, med“setInterval ()”Metode eller“AddEventListener ()”Metode. Vinduet.Onload -hendelse med metoden Settimeout () brukes til å laste siden etter den spesifiserte tiden mens med SetInterval () -metoden, laster siden gjentatte ganger etter det aktuelle tidsintervallet. AddEventListener () -metoden kan brukes for å legge ved en hendelse og laste siden så snart hendelsen utløses på DOM. Denne artikkelen illustrerte metodene for å vente på at en side lastes inn i JavaScript.