Temporizador de página de actualización de JavaScript

Abid Ullah 20 junio 2023
  1. Actualizar automáticamente la página web usando JavaScript
  2. Actualizar automáticamente una página web cada 5 segundos usando JavaScript
Temporizador de página de actualización de JavaScript

Este artículo enseñará sobre el temporizador de actualización de página en JavaScript. Veremos cómo podemos codificar JavaScript en una página HTML para actualizar automáticamente la página cada 5 segundos.

Actualizar manualmente la página web parece un proceso que hace perder tiempo y esfuerzo, ya que ahora podemos actualizar automáticamente las páginas web en nuestros navegadores con la ayuda de JavaScript. Entonces, ahora comprendamos cómo podemos hacer eso usando JavaScript.

Actualizar automáticamente la página web usando JavaScript

Podemos actualizar una página web automáticamente usando JavaScript. Una página web se puede actualizar después de un número específico de segundos usando JavaScript en la página HTML.

Podemos usar el método ubicación.recargar de JavaScript para actualizar una página web automáticamente. Con este método en JavaScript, se puede invocar un código automáticamente en un evento o cuando un usuario hace clic en un enlace.

Usamos el siguiente código si queremos actualizar una página web con un clic del mouse.

Código de ejemplo para usar el clic del mouse:

<html>
<head>
    <title>JavaScript refresh page</title>
</head>
<body>
  <button>
    <a href="javascript:location.reload(true)"> Click Refresh the Page</a></button>
</body>
</html>

Manifestación

Producción:

Usar un clic del mouse para actualizar una página web

Como podemos ver en la salida, tenemos una opción de botón clic para actualizar la página web. Una página web se actualiza cuando un usuario hace clic en el botón hacer clic.

Podemos usar JavaScript para actualizar la página web haciendo clic con el mouse.

Actualizar automáticamente una página web cada 5 segundos usando JavaScript

También podemos usar JavaScript para actualizar una página web automáticamente después de un tiempo determinado. En este caso, dimos 5 segundos del tiempo.

Usando el método ubicación.recargar y la función setTimeout(); podemos actualizar una página web cada 5 segundos. El setTimeout() es una función de JavaScript incorporada que usamos para ejecutar otra función después de un intervalo de tiempo determinado.

Para comprender mejor este método, probemos el siguiente código de ejemplo. En el siguiente código, tenemos un código HTML donde usamos JavaScript.

En JavaScript, usamos la función setTimeout para ejecutar location.reload() en el código. En la sección del cuerpo del código, le dimos los 5 segundos, que puede cambiar según sus requisitos.

Después de ejecutar este código, la página web se actualizará automáticamente cada 5 segundos.

Código de ejemplo para actualizar una página web cada 5 segundos:

<html>
   <head>
      <script type = "text/JavaScript">
            function AutoRefresh( t ) {
               setTimeout("location.reload(true);", t);
            }
      </script>
   </head>
   <body onload = "JavaScript:AutoRefresh(5000);">
      <p>Your Page will refresh every 5 seconds!</p>
   </body>
</html>

Manifestación

La salida del código:

Mostrar un mensaje para actualizar la página web cada 5 segundos

Como podemos ver, la salida muestra este mensaje después de ejecutar el código. Significa que la página web se actualizará automáticamente cada 5 segundos.

Es cómo podemos usar JavaScript para actualizar una página web automáticamente cada 5 segundos.

Esperamos que este artículo le resulte útil para comprender cómo usar JavaScript para actualizar una página web automáticamente.

Autor: Abid Ullah
Abid Ullah avatar Abid Ullah avatar

My name is Abid Ullah, and I am a software engineer. I love writing articles on programming, and my favorite topics are Python, PHP, JavaScript, and Linux. I tend to provide solutions to people in programming problems through my articles. I believe that I can bring a lot to you with my skills, experience, and qualification in technical writing.

LinkedIn