Aszinkron futás

10. osztály 10.évf_js JavaScript Web

setTimeout(), setInterval

  • setTimeout(function, milliseconds)
    Akkor fut le a megadott függvény, amikor a beállított idő letelik. A beálított időzítést a clearTimeout() függvénnyel lehet törölni.
  • setInterval(function, milliseconds)
    A megadott függvény futtatja le megadott időközönként. Az időzítést a clearInterval() függvénnyel tudjuk megtenni.

The setTimeout() and setInterval() metódusok a HTML DOM Window objektumhoz tartoznak.

1. feladat : Írasd ki a pontos időt SetInterval segítsésével! Gombnyomásra lehessen megállítani, indítani az órát!

<!DOCTYPE html>
<html>
<body>
<h1>A Window objektum</h1>
<h2>A setInterval() és a clearInterval() eljárások</h2>
<p id="szoveghelye"></p>
<p id="ell"></p>
<button onclick="megallit()">Leállítás</button>
<button onclick="indit()">Indítás</button>
<script>
var milisec = setInterval(ora_fuggveny, 1000);
function indit(){
milisec = setInterval(ora_fuggveny, 1000);
}
function ora_fuggveny() {
  const datum = new Date();
  document.getElementById("szoveghelye").innerHTML = datum.toLocaleTimeString();  
}
function megallit() {
  clearInterval(milisec);
}
</script>
</body>
</html>

2. feladat: Készíts programot, amely a setTimeout() segítségével feldob egy üdvözlő ablakot!

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Időzítzés</h2>
<p>Nyomd meg a teszt gombot, és 3mp múlva üdvözöl az oldal!</p>
<button onclick="setTimeout(fuggvenyHello, 3000);">Teszt</button>
<script>
function fuggvenyHello() {
  alert('Helló!');
}
</script>
</body>
</html>