Heim >Web-Frontend >js-Tutorial >Wie verwende ich die setInterval-Funktion in Javascript?

Wie verwende ich die setInterval-Funktion in Javascript?

Guanhui
GuanhuiOriginal
2020-06-24 17:42:514544Durchsuche

Die Funktion setInterval in JavaScript besteht darin, eine Funktion aufzurufen oder einen Ausdruck gemäß der angegebenen Zykluszeit zu berechnen. Der Rückgabewert ist eine ID kann an die Funktion „clearInterval“ übergeben werden, um die Ausführung abzubrechen.

Wie verwende ich die setInterval-Funktion in Javascript?

Verwendungsbeispiel

Sie können alle drei Sekunden (3000 Millisekunden) ein Pop-up aufrufen, indem Sie eine benannte Funktion „Hallo“ aufrufen. :

var myVar;
 
function myFunction() {
    myVar = setInterval(alertFunc, 3000);
}
 
function alertFunc() {
    alert("Hello!");
}

Zeigen Sie die aktuelle Uhrzeit an (die Methode setInterval() führt die Funktion einmal pro Sekunde aus, ähnlich der Watch-Funktion):

var myVar = setInterval(function(){ myTimer() }, 1000);
 
function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}

Verwenden Sie clearInterval(), um die Ausführung von setInterval zu stoppen :

var myVar = setInterval(function(){ myTimer() }, 1000);
 
function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}
 
function myStopFunction() {
    clearInterval(myVar);
}

Verwenden Sie setInterval() und clearInterval(), um einen dynamischen Fortschrittsbalken zu erstellen:

function move() {
  var elem = document.getElementById("myBar"); 
  var width = 0;
  var id = setInterval(frame, 10);
  function frame() {
    if (width == 100) {
      clearInterval(id);
    } else {
      width++; 
      elem.style.width = width + '%'; 
    }
  }
}

Empfohlenes Tutorial: „JavaScript

Das obige ist der detaillierte Inhalt vonWie verwende ich die setInterval-Funktion in Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn