Temporizador de página de actualización de JavaScript

Implementar un temporizador de página de actualización en JavaScript es muy útil, ya que permite a los usuarios asegurarse de que el contenido en el sitio en particular sea relevante y actualizado. Además, ayuda a actualizar una página web o un sitio en la fase de automatización. Del mismo modo, permite a los usuarios finales acceder al último contenido en un sitio en particular a tiempo.

Cómo implementar el temporizador de página de actualización en JavaScript?

Para implementar el temporizador de actualización JavaScript, se pueden utilizar los siguientes enfoques:

• Método "setTimeOut ()".
• Evento "Onload".
• Método "setInterval ()".

Enfoque 1: Implemente el temporizador de la página de actualización en JavaScript a través del método setTimeOut ()

El "setTimeout ()El método se redirige a una función después de la hora establecida. Este enfoque se puede aplicar para redirigir a la función especificada en el botón Haga clic y actualice la página después de la hora establecida.

Sintaxis

En la sintaxis dada:

• "función"Indica la función accedida.
• "milisegundos"Se refiere al intervalo de tiempo para ejecutar.
• "par1" y "par2"Corresponde a los parámetros adicionales.

Ejemplo

Sigamos el ejemplo declarado a continuación:

Esta página se actualizará cada 4 segundos!

En el fragmento de código anterior, realice los siguientes pasos:

• Incluir el declarado "Título" y "encabezado".
• Además, cree un botón con un adjunto "al hacer clic"Redirección de eventos a la función Refreshtimer ().
• En la parte de JavaScript del código, declare una función llamada "Refreshtimer ()".
• En su definición, aplique el "setTimeout ()" método. En su parámetro, aplique el "ubicación.recargar()Método "con el valor booleano establecido. En su otro parámetro, especifique el tiempo establecido.
• Esto dará como resultado actualizar la página después de cada "4 segundos"Sobre el clic del botón.

Producción

En la salida anterior, se puede observar que la página se actualiza durante cada 4 segundos.

Enfoque 2: Implemente el temporizador de la página de actualización en JavaScript usando el evento Onload

Un evento de "carga" entra en vigencia cuando se carga un objeto. Este enfoque se puede utilizar para actualizar la página después de la carga de la página con respecto al valor establecido del temporizador.

Sintaxis

En la sintaxis dada:

• "función"Corresponde a la función accedida cuando se carga el objeto.

Ejemplo

Observe los pasos establecidos en el siguiente ejemplo:

Esta página se actualizará después de cada 8 segundos!

En las líneas de código anteriores:

• Aplica el "encendido"Evento a la función refreshtimer () que tiene el temporizador establecido como su parámetro. Esto dará como resultado invocar la función especificada en la página cargada.
• Además, especifique el encabezado declarado.
• En la parte de JavaScript del código, defina una función llamada "Refreshtimer ()."
• En su definición, de manera similar, repita el paso discutido en el enfoque anterior para aplicar el "setTimeout ()Método que tiene los parámetros establecidos.
• Aquí, "Temporizador"Se refiere al valor de parámetro aprobado del temporizador.

Producción

De la salida anterior, es evidente que después de cargar la página, se actualiza después de 8 segundos.

Enfoque 3: Implemente el temporizador de la página de actualización en JavaScript usando el método setinterval ()

El "setInterval ()El método se redirige a una función a intervalos de tiempo especificados. Este método se puede aplicar repetidamente y actualizar la página después del límite del temporizador establecido.

Sintaxis

En la sintaxis anterior:

• "función"Punta a la función de acceso.
• "milisegundos"Se refiere al intervalo de tiempo específico para ejecutar.
• "PAR1" y "PAR2" corresponder a los parámetros adicionales.

Ejemplo

Sigamos el ejemplo declarado a continuación:

Esta página se actualizará cada 5 segundos!

En el fragmento de código anterior:

• Incluya los encabezados establecidos para mostrar el mensaje y contener el temporizador a incrementar respectivamente.
• En la parte JavaScript del código, inicialice el temporizador con "1".
• En el siguiente paso, aplique el "setInterval ()" método. Además, busque el encabezado especificado por su "identificación" utilizando el "getElementById ()Método para contener el temporizador.
• Incrementa el temporizador de tal manera que después del "5 segundos"Cuenta, la página se actualiza a través del"ubicación.recargar()" método.

Producción

En la salida anterior, se puede observar que la página se actualiza después de 5 segundos.

Conclusión

El "setTimeout ()"Método, un"encendido"Evento, o el"setInterval () ”El método se puede utilizar para implementar un temporizador de página de actualización en JavaScript. El método setTimeOut () se puede implementar para invocar una función en el botón Haga clic y actualice la página después de la hora establecida. Se puede aplicar un evento de encendido para implementar el temporizador en la carga de la página y actualizarlo de acuerdo con el valor del temporizador establecido. El método SetInterval () puede actualizar repetidamente la página después del límite del temporizador SET. Este blog explica cómo implementar un temporizador de página de actualización en JavaScript.