JavaScript Aguarde a página carregar

As páginas ou sites da web que você visita geralmente deixam o usuário esperar para exibir uma mensagem importante ou um aviso antes de acessar um determinado componente. Por exemplo, ao pedir a um usuário para comprar a associação ou login antes de acessar o conteúdo do site ou para o gerenciamento de tráfego apropriado no caso de sites educacionais. Nesses casos, você pode deixar o usuário esperar por uma página até que seja carregado.

Este blog discutirá as metodologias que podem ser usadas para definir o tempo de carregamento da página em JavaScript.

Como esperar para uma página carregar em javascript?

Você pode esperar que uma página seja carregada no JavaScript usando as seguintes abordagens:

• • Evento de Onload de janela com “setTimeout ()”Método
  • Evento de Onload de janela com “setInterval ()”Método
  • ““addEventListener ()”Método

Os conceitos mencionados serão demonstrados um por um!

Método 1: aguarde a página carregar em javascript usando janela.Evento OnLoad com o método setTimeout ()

O "janela.carregando”O evento ocorre quando a janela foi carregada e o“ “setTimeout ()”O método chama uma função após o tempo de configuração especificado. Mais especificamente, essas abordagens podem ser combinadas para carregar a janela após o tempo de espera especificado.

Sintaxe

setTimeout (função, milissegundos)

Na sintaxe dada, a função refere -se à função acessada “carga de espera ()”, E milissegundos indica o“definir tempo”Em milissegundos.

O exemplo abaixo do ritmo demonstra o conceito declarado.

Exemplo

Em primeiro lugar, utilize o “janela.carregandoEvento junto com o “setTimeout ()”Método para carregar a janela após o tempo definido em milissegundos. O tempo de espera especificado será aplicado à função de espera ():

janela.OnLoad = Settimeout (Carga de espera, 3000)

Agora, defina a função chamada “carga de espera ()”Na tag. Esta função específica será acessada na carga da janela e notificará o usuário com as seguintes mensagens via alerta e no modelo de objeto de documento (DOM), respectivamente:

Função Waitload ()
Alerta ("Carregado!")
documento.Write ("Esta página está carregada agora!")
;

Pode -se observar que a página é carregada após o tempo especificado de 3 segundos de espera:

Se você deseja carregar a página após um tempo de espera especificado repetidamente, utilize o seguinte método.

Método 2: Aguarde a página carregar em JavaScript usando a janela.Evento OnLoad With SetInterval () Método

O "janela.carregando”O evento, como discutido acima, é acionado quando a janela foi carregada. O "setInterval ()”Método acessa uma função especificada repetidamente nos intervalos de tempo especificados calculados em milissegundos.

Sintaxe

setInterval (função, milissegundos)

Aqui o "função”Refere -se à função que precisa ser executada e“milissegundos”É seu intervalo de tempo definido.

Exemplo

No exemplo a seguir, definiremos o intervalo de tempo como o argumento na função definida. Imprima uma mensagem específica por meio de um alerta no DOM a cada 3 segundos quando a página for carregada repetidamente:

janela.onLoad = setInterval (function ()
Alerta ("Carregado!")
documento.Write ("Esta página está carregada agora!")
, 3000);

Saída

Na saída extraída, é evidente que a página é carregada repetidamente após o tempo de espera especificado.

Método 3: Aguarde a página carregar em JavaScript usando o método addEventListener ()

O "addEventListener ()”O método aplica um manipulador de eventos ao documento. Este método pode ser implementado para anexar um evento específico e carregar a página ao clicar em qualquer lugar do DOM.

Sintaxe

documento.addEventListener (evento, função)

Na sintaxe dada, “evento”Refere -se ao evento que será desencadeado e“função”Aponta para a função que executa alguma funcionalidade no evento desencadeado.

Exemplo

Primeiro, vamos anexar um evento “clique”Para o documento usando o método addEventListener (). Ao desencadear o evento especificado, a função chamada “carga de espera ()”Será executado:

documento.addEventListener ("clique", carga de espera)

Defina a função “carga de espera ()”Em que exibe a seguinte mensagem no DOM no evento desencadeado:

Função Waitload ()
documento.Write ("A página está carregada agora!");

Nesta saída específica, a página é carregada ao clicar no cursor em qualquer lugar do DOM:

Nós compilamos diferentes métodos para esperar a página carregar.

Conclusão

Para esperar para carregar uma página em JavaScript, utilize o janela.carregando evento com o “setTimeout ()”Método, com“setInterval ()”Método ou o“addEventListener ()”Método. A janela.Evento OnLoad com o método setTimeout () é usado para carregar a página após o tempo especificado, enquanto com o método setInterval (), a página carrega repetidamente após o intervalo de tempo específico. O método addEventListener () pode ser utilizado para anexar um evento e carregar a página assim que o evento for acionado no DOM. Este artigo ilustrou os métodos para esperar que uma página carregue em javascript.