window.onload versus document.onload in JavaScript

Window Onload Versus Document Onload In Javascript



In javascript, ' venster.onload ' en ' document.onload ” zijn twee gebeurtenissen die vaak worden gebruikt om ervoor te zorgen dat de pagina volledig is geladen voordat er code wordt uitgevoerd. De gebeurtenis document.onload vindt plaats vóór de gebeurtenis window.onload wanneer het volledige HTML-document is geladen, terwijl de gebeurtenis window.onload daarna plaatsvindt wanneer alles op de pagina is geladen, inclusief illustraties.

Deze blog laat het verschil zien tussen window.onload en document.onload in JavaScript.

window.onload versus document.onload in JavaScript

De ' venster.onload ”-gebeurtenis wordt geactiveerd wanneer de hele pagina (inclusief de bronnen) klaar is met laden. Dit betekent dat u deze gebeurtenis kunt gebruiken om ervoor te zorgen dat de pagina volledig is geladen voordat u code uitvoert die afhankelijk is van de inhoud van de pagina.







De ' document.onload ”-gebeurtenis is vergelijkbaar met de window.onload, maar wordt alleen geactiveerd wanneer de DOM van het document (de structuur van de inhoud van de pagina) klaar is met laden. Dit betekent dat u deze gebeurtenis kunt gebruiken om ervoor te zorgen dat de inhoud van de pagina volledig is geladen en klaar is om te worden gemanipuleerd voordat er code wordt uitgevoerd.



Wat is de beste aanpak om te volgen?

Over het algemeen is het een goed idee om een ​​document.onload te gebruiken in plaats van de window.onload als u er alleen voor hoeft te zorgen dat de inhoud van de pagina volledig is geladen voordat u uw code uitvoert. Dit komt omdat document.onload sneller zal starten dan een window.onload, wat de prestaties van uw code kan verbeteren. Als u er echter voor wilt zorgen dat de bronnen van de pagina (zoals afbeeldingen en stylesheets) volledig zijn geladen voordat u uw code uitvoert, moet u in plaats daarvan de window.onload gebruiken.



Hoe gebruik je window.onload versus document.onload in JavaScript?

In het gegeven voorbeeld zullen we zien hoe deze gebeurtenissen het laden van het document en het laden van het venster identificeren voordat er code wordt uitgevoerd.





Bel de ' document.onload ”-gebeurtenis die u informeert dat het document is geladen met behulp van een alert()-bericht:

document. laden = alarm ( 'document_onload' ) ;

Bel de ' venster.onload 'gebeurtenis en wijs er het resulterende bericht van een methode alert() aan toe:



venster. laden = alarm ( 'window_onload' ) ;

Zoals u kunt zien, wordt het eerste document geladen wanneer de pagina wordt vernieuwd en wordt de methode voor het laden van het venster aangeroepen wanneer de volledige pagina is geladen:

Dat is alles over de gebeurtenissen window.onload en document.onload in JavaScript.

Gevolgtrekking

De ' venster.onload ' en ' document.onload ” zijn twee JavaScript-gebeurtenissen om ervoor te zorgen dat de volledige pagina wordt geladen voordat er code wordt uitgevoerd. Document.onload wordt sneller geactiveerd dan window.onload, wat de prestaties van de code kan verbeteren. Deze blog demonstreerde het verschil tussen window.onload en document.onload in JavaScript.