Qual a diferença entre $(document).ready() e window.onload?

Neste artigo veremos a diferença entre $(document).ready() e window.onload – o que estas duas instruções podem fazer em cada caso de uso

Fala programador(a), vamos então conhecer as duas instruções a fundo!

Entenda a $(document).ready

A instrução $(document).ready foi criada no jQuery, e serve para que o código JavaScript entre em execução apenas quando o HTML for carregado

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

• 120 aulas
• 4 projetos
• 9h 45min

Conhecer formação

Isso evita que o código que criamos falhe por causa de algum elemento ainda não renderizado no HTML

Temos a garantia que o mesmo só vai valer depois que toda a árvore de elementos de HTML estão plenamente inseridos na página

Não importando onde o código de JavaScript/jQuery é posicionado

Entenda o window.onload

Já a instrução window.onload é nativa do JavaScript, podemos utilizar ela com jQuery, porém o contrário não acontece, o ready não funciona com JS puro

E ao usar este evento o JavaScript entende que o código abrigado nele deve começar a valer apenas quando todos os elementos da página carregarem

Ou seja, além das tags do HTML, as imagens também deverão já estarem prontas e visíveis

Sendo assim a instrução ready é mais performática, pois o código já pode ser executado antes do que o código que fica inserido em window.onload

Porém se você não estiver utilizando jQuery, a única saída para o seu problema de carregamento de página é o onload, tenha isso em mente

Conclusão

Neste artigo vimos a diferença entre $(document).ready() e window.onload

A instrução ready foi desenvolvida para o jQuery, não sendo disponível no JS Vanilla

Já o onload é nativa do JavaScript

O código dentro de ready é executado assim que todos os elementos HTML forem carregados, já no onload todos os elementos da página precisam ser carregados para o código JS entrar em execução

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube