Questo blog dimostrerà la differenza tra window.onload e document.onload in JavaScript.
window.onload vs document.onload in JavaScript
Il ' window.onload L'evento ” viene attivato quando l'intera pagina (incluse le sue risorse) ha terminato il caricamento. Ciò significa che puoi utilizzare questo evento per assicurarti che la pagina sia completamente caricata prima di eseguire qualsiasi codice basato sul contenuto della pagina.
Il ' document.onload ” è simile a window.onload, ma si attiva solo quando il DOM del documento (la struttura del contenuto della pagina) ha terminato il caricamento. Ciò significa che puoi utilizzare questo evento per assicurarti che il contenuto della pagina sia completamente caricato e pronto per essere manipolato prima di eseguire qualsiasi codice.
Qual è l'approccio migliore da seguire?
In generale, è una buona idea utilizzare un document.onload invece di window.onload se devi solo assicurarti che il contenuto della pagina sia completamente caricato prima di eseguire il codice. Questo perché document.onload si attiverà più velocemente di un window.onload, il che può migliorare le prestazioni del tuo codice. Tuttavia, se devi assicurarti che le risorse della pagina (come immagini e fogli di stile) siano completamente caricate prima di eseguire il codice, allora dovresti utilizzare window.onload.
Come utilizzare window.onload vs document.onload in JavaScript?
Nell'esempio fornito, vedremo come questi eventi identificano il caricamento del documento e il caricamento della finestra prima di eseguire qualsiasi codice.
Chiama il ' document.onload ” evento che informa che il documento è stato caricato utilizzando un messaggio alert():
documento. onload = mettere in guardia ( 'document_onload' ) ;Chiama il ' window.onload ” e assegnargli il messaggio risultante di un metodo alert():
finestra. onload = mettere in guardia ( 'window_onload' ) ;
Come puoi vedere, quando la pagina viene aggiornata, viene caricato il primo documento, quindi viene richiamato il metodo window onload quando l'intera pagina ha terminato il caricamento:
Questo è tutto sugli eventi window.onload e document.onload in JavaScript.
Conclusione
Il ' window.onload ' e ' document.onload ” sono due eventi JavaScript per assicurarsi che la pagina completa venga caricata prima di eseguire qualsiasi codice. Il document.onload si attiverà più velocemente di window.onload, che può migliorare le prestazioni del codice. Questo blog ha dimostrato la differenza tra window.onload e document.onload in JavaScript.