¿Cómo ejecutar una función despues de transcurrir x número de segundos con setTimeout de JavaScript?

Estrada Web Group
Estrada Web Group
¿Cómo ejecutar una función despues de transcurrir x número de segundos con setTimeout de JavaScript?

El método setTimeout() permite ejecutar una función en JavaScript después de pasar cierto tiempo establecido previamente, es decir manda llamar una función después de esperar un número específico de milisegundos.

¿Para qué sirve setTimeout en JavaScript?

La función setTimeout nativa de JavaScript llama a una función o ejecuta un fragmento de código después de un retraso especificado (en milisegundos). Esto podría ser útil si, por ejemplo, deseas mostrar una ventana emergente después de que un usuario haya estado navegando por tu página durante un cierto período, o si deseas un breve retraso antes de eliminar un efecto de desplazamiento de un elemento (en caso de que el usuario accidentalmente lo elimine).

Sintaxis

window.setTimeout(function, milliseconds);

Parámetro: este método acepta dos parámetros:

  • function: es la función a ejecutar
  • milliseconds: indica el número de milisegundos antes de que ejecute la función.

Temas relacionados:

¿Cómo mostrar la hora actual en mi página web con JavaScript?

Variables y tipos de datos en JavaScript

Entendiendo el ámbito de las variables en JavaScript

Por ejemplo, queremos que aparezca un cuadro de alerta, 2 segundos después de que el usuario presione el botón de clic.

<!DOCTYPE html>
<html>
<head>
    <title>
       Estrada Web Group | DOM Window setTimeout() method
    </title>
</head>
<body>

    <button onclick="setTimeout(gfg, 2000);">
      Presiona aquí
    </button>  

    <script>
        function gfg() {
            alert('Bienvenido a Estrada Web Group');
        }
    </script>

</body>

</html>

Salida:

Cuando el usuario presione el botón " Presiona aquí", luego de una pausa de 2 segundos, aparecerá el mensaje alerta despues de pasar 2 segundos como se muestra en la siguiente imagen:

setTimeout

 

Compartir artículo:

Más artículos geniales

Var, Let y Const en JavaScript: ¿cuál es la diferencia?

Var, Let y Const en JavaScript: ¿cuál es la diferencia?

En este artículo, analizare y tratare de explicar las diferencias entre var, let y const de JavaScript, además analizare su alcance, uso y sus mejoras. Una de las características que viene con ES6 es la adición de let y const, que se puede usar para la declaración de variables.

Ver artículo completo
¿Qué es una Cookie? y ¿Cómo crearlas y leerlas con jQuery?

¿Qué es una Cookie? y ¿Cómo crearlas y leerlas con jQuery?

En este artículo explicaré con un ejemplo, cómo agregar cookies usando jQuery, es decir, guardar y consultar cookies en el navegador usando jQuery. Pero primero veremos que es una cookie y que se puede hacer con ella.

Ver artículo completo
Introducción a las funciones constructoras de JavaScript

Introducción a las funciones constructoras de JavaScript

Resumen: en este tutorial, aprenderás sobre la función de constructor de JavaScript y cómo usar la palabra clave new para crear un objeto. 

Ver artículo completo

Manténgase actualizado

Obtenga excelente contenido en su bandeja de entrada todas las semanas.
Solo contenido excelente, no compartimos su correo electrónico con terceros.
Subir al inicio de la pantalla