Neste artigo você aprenderá a como executar uma função ao carregar a página com JavaScript, utilizando um evento da linguagem!
Fala programador(a), beleza? Bora aprender mais sobre eventos e funções em JavaScript!
Para resolver nosso problema temos duas abordagens:
- Utilizando o objeto window;
- Utilizando um evento de DOM;
Em window temos uma propriedade que pode executar uma função no carregamento, que é a onload
Já o evento vamos executar em document, e o nome dele é DOMContentLoaded
Veja primeiramente abordagem com window:
window.onload = function() {
// Sua função aqui
};
Já através do DOM, utilize a seguinte abordagem:
document.addEventListener("DOMContentLoaded", function() {
// Sua função aqui
});
Onde temos o comentário, você vai colocar o nome da sua função e executar
Simples assim, basta escolher o que precisa rodar dentro das funções anônimas das duas abordagens que foram colocadas aqui neste artigo
Ambas tem os mesmos resultados, porém a segunda acaba sendo mais correta, pois é o padrão dos eventos de JavaScript
Deixe um comentário contando o que achou desta solução 🙂
Quer aprender mais sobre JavaScript? Confira o vídeo abaixo:
Conclusão
No artigo de hoje você aprendeu a como executar uma função ao carregar a página
Utilizamos duas abordagens, a primeira foi com o objeto global window
Onde utilizamos a sua propriedade onload, e podemos executar algo
E a segunda foi com um evento de DOM em document
O nome do evento é DOMContentLoaded, e é executado justamente quando a página é iniciada
Deseja programar de forma profissional? Confira o nosso treinamento completo clicando aqui.
Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!
Há também o nosso canal no YouTube, com muito conteúdo gratuito de qualidade!