A JavaScriptet kliensoldali programozási nyelvként, valamint szerveroldali programozási nyelvként használják. Aztmódszerek sokaságát nyújtja számos funkció egyszerű elvégzésére. Ez tette az egyik legnépszerűbb programozási nyelv, valamint széles körben használják többféle termékfejlesztésben is.A SetInterval a JavaScript-ben az Események időzítése része a JavaScript-ben, és a következő sorrendben fogjuk megtudni:
Események időzítése
A JavaScript lehetővé teszi a funkciókat valamint a program végrehajtási idejére és nem a végrehajtási idejére vonatkozó módszereket. Ez lehetővé teszi a funkciók végrehajtását a megadott időpontban, függetlenül a program végrehajtásának időpontjától.
Az Események időzítése JavaScriptben történő használatának két fő módja:
setTimeout (függvény, ezredmásodperc)
Ez a függvény a belsejében lévő függvényt adja meg, amely paraméterként a megadott idő után milliszekundumban csak egyszer kerül átadásra.
setInterval (függvény, ezredmásodperc)
Ez a függvény a végrehajtási időből és minden elért időintervallum után hajtja végre a funkciót. Minden időintervallumban megismétli a függvény végrehajtását.
Most lépjünk tovább, és nézzük meg, hogyan működik a JavaScript SetInterval.
SetInterval a JavaScript-ben
Ennek a függvénynek az első paramétere a végrehajtandó funkció, a második paraméter pedig az egyes végrehajtások közötti időintervallumot jelöli.
var myVar = setInterval (myTimer, 1000) function myTimer () {var d = new Date () document.getElementById ('demo'). internalHTML = d.toLocaleTimeString ()}Itt a document.getElementById kapja az elemet amelynek az azonosítója „demo” és a d.toLocaleTimeString () függvény adja meg az aktuális időt a rendszerből.
Ezért ezt 1000 milliszekundumonként megismételjük, ami 1 másodpercnek felel meg. Így a funkciót 1 másodpercenként ismételten végrehajtják, ezért az idő másodpercenként frissül.
Tehát hogyan állíthatjuk meg ezt a kivégzést? Találjuk ki!
Hogyan lehet megállítani a végrehajtást?
A setInterval () függvényből le tudjuk állítani a végrehajtást egy másik, a clearInterval () nevű függvény segítségével.A clearInterval () a setInterval () függvényből kapott változót használja.
Például:
myVar = setInterval (függvény, milliszekundum) clearInterval (myVar)
Az alábbiakban bemutatunk egy példát, amely a setInterval () és a clearInterval () függvényeket egyaránt használja. Ez elindítja az órát, és egy gombot biztosít az idő leállításához.
Az alábbiakban egy óra látható.
Stop idő
Az idő leállításához kattintson a fenti gombra.
var myVar = setInterval (myTimer, 1000) function myTimer () {var d = new Date () document.getElementById ('demo'). internalHTML = d.toLocaleTimeString ()}
Kimenet:
hívás hivatkozással c ++ példa
Néhány további példa a setInterval () és a clearInterval () lehetőségekkel.
Dinamikus folyamatjelző létrehozása
#myProgress {szélesség: 100% magasság: 30px pozíció: relatív háttérszín: #ddd} #myBar {háttérszín: # 4CAF50 szélesség: 10px magasság: 30px pozíció: abszolút}
Kattintson az Én függvény mozgatása () {var elem = document.getElementById ('myBar') var width = 0 var id = setInterval (frame, 10) function frame () {if (width == 100) {clearInterval (id)} else {szélesség ++ elem.style.width = szélesség + '%'}}}Kimenet:
A kezdeti kimenet
Kimenet a „Click Me” feliratú gombra kattintás után.
Váltás két háttér között
A var myVar = setInterval (setColor, 300) függvény setColor () {var x = document.body x.style.backgroundColor = x.style.backgroundColor == 'sárga'? 'pink': 'yellow'} függvény stopColor () {clearInterval (myVar)}Kimenet:
A szín a sárga és a rózsaszín közé vált. A fenti kimenet a gombra kattintás előtt, az alábbi pedig a gombra való kattintás után következik.
Ezzel elérkeztünk a SetInterval in JavaScript cikkünkhöz. Remélem, megértette a SetInterval módszer működését.
Nézze meg a írta Edureka. A webfejlesztési tanúsítási képzés segít megtanulni, hogyan hozhat létre lenyűgöző weboldalakat HTML5, CSS3, Twitter Bootstrap 3, jQuery és Google API-k segítségével, és telepítheti az Amazon Simple Storage Service (S3) szolgáltatásba.
Van egy kérdésünk? Kérjük, említse meg ennek a blognak a megjegyzés rovatában, és mi kapcsolatba lépünk Önnel.