window.onload vs document.onload JavaScriptissä

Window Onload Vs Document Onload Javascriptissa



JavaScriptissä ' window.onload ' ja ' document.onload ” ovat kaksi tapahtumaa, joita käytetään usein varmistamaan, että sivu on ladattu kokonaan ennen koodin suorittamista. document.onload-tapahtuma tapahtuu ennen window.onload-tapahtumaa, kun koko HTML-dokumentti on latautunut, kun taas window.onload-tapahtuma tapahtuu sen jälkeen, kun kaikki sivulla oleva, mukaan lukien kuvat, on ladattu.

Tämä blogi näyttää eron JavaScriptin window.onload ja document.onload välillä.

window.onload vs document.onload JavaScriptissä

' window.onload ” -tapahtuma käynnistyy, kun koko sivu (mukaan lukien sen resurssit) on latautunut. Tämä tarkoittaa, että voit käyttää tätä tapahtumaa varmistaaksesi, että sivu on ladattu täyteen ennen kuin suoritat sivun sisältöön perustuvaa koodia.







' document.onload ”-tapahtuma on samanlainen kuin window.onload, mutta se käynnistyy vasta, kun asiakirjan DOM (sivun sisällön rakenne) on latautunut. Tämä tarkoittaa, että voit käyttää tätä tapahtumaa varmistaaksesi, että sivun sisältö on täysin ladattu ja valmis muokattavaksi ennen koodin suorittamista.



Mikä on paras lähestymistapa?

Yleensä on hyvä idea käyttää document.onload-tiedostoa window.onload-tiedoston sijaan, jos sinun on vain varmistettava, että sivun sisältö on ladattu kokonaan ennen koodin suorittamista. Tämä johtuu siitä, että document.onload käynnistyy nopeammin kuin window.onload, mikä voi parantaa koodisi suorituskykyä. Jos sinun on kuitenkin varmistettava, että sivun resurssit (kuten kuvat ja tyylisivut) on ladattu täyteen ennen koodin suorittamista, sinun tulee käyttää windows.onload-tiedostoa sen sijaan.



Kuinka käyttää window.onloadia ja document.onloadia JavaScriptissä?

Annetussa esimerkissä näemme, kuinka nämä tapahtumat tunnistavat asiakirjan latauksen ja ikkunalatauksen ennen koodin suorittamista.





Soita ' document.onload ”tapahtuma, joka ilmoittaa, että asiakirja on ladattu hälytysviestillä:

asiakirja. lastina = hälytys ( 'document_onload' ) ;

Soita ' window.onload ” tapahtuma ja määritä sille tuloksena oleva alert()-metodin viesti:



ikkuna. lastina = hälytys ( 'window_onload' ) ;

Kuten näet, kun sivu päivitetään, ensimmäinen asiakirja ladataan, ja sitten ikkunan latausmenetelmä otetaan käyttöön, kun koko sivu on latautunut:

Siinä on kaikki JavaScriptin window.onload- ja document.onload-tapahtumissa.

Johtopäätös

' window.onload ' ja ' document.onload ” ovat kaksi JavaScript-tapahtumaa, joilla varmistetaan, että koko sivu latautuu ennen koodin suorittamista. document.onload käynnistyy nopeammin kuin window.onload, mikä voi parantaa koodin suorituskykyä. Tämä blogi osoitti JavaScriptin window.onloadin ja document.onloadin eron.