Este blog demonstrará a diferença entre window.onload e document.onload em JavaScript.
window.onload vs document.onload em JavaScript
O ' window.onload ” é disparado quando a página inteira (incluindo seus recursos) termina de carregar. Isso significa que você pode usar esse evento para garantir que a página seja totalmente carregada antes de executar qualquer código que dependa do conteúdo da página.
O ' document.onload ” é semelhante ao evento window.onload, mas só é acionado quando o DOM do documento (a estrutura do conteúdo da página) termina de carregar. Isso significa que você pode usar esse evento para garantir que o conteúdo da página esteja totalmente carregado e pronto para ser manipulado antes de executar qualquer código.
Qual é a melhor abordagem a seguir?
Em geral, é uma boa ideia usar um document.onload em vez de window.onload se você precisar apenas garantir que o conteúdo da página esteja totalmente carregado antes de executar seu código. Isso ocorre porque document.onload será acionado mais rapidamente do que window.onload, o que pode melhorar o desempenho do seu código. No entanto, se você precisar garantir que os recursos da página (como imagens e folhas de estilo) sejam totalmente carregados antes de executar seu código, use window.onload.
Como usar window.onload vs document.onload em JavaScript?
No exemplo dado, veremos como esses eventos identificam o carregamento do documento e o carregamento da janela antes de executar qualquer código.
Ligar para ' document.onload ” que informa que o documento foi carregado usando uma mensagem alert():
documento. carregando = alerta ( 'document_onload' ) ;Ligar para ' window.onload ” e atribua a mensagem resultante de um método alert() a ele:
janela. carregando = alerta ( 'window_onload' ) ;
Como você pode ver, quando a página é atualizada, o primeiro documento é carregado e, em seguida, o método onload da janela é invocado quando a página inteira termina de carregar:
Isso é tudo sobre os eventos window.onload e document.onload em JavaScript.
Conclusão
O ' window.onload ' e ' document.onload ” são dois eventos JavaScript para garantir que a página completa carregue antes de executar qualquer código. O document.onload disparará mais rápido que o window.onload, o que pode melhorar o desempenho do código. Este blog demonstrou a diferença entre window.onload e document.onload em JavaScript.