Okno setInterval()
Przykłady
Wyświetlaj „Hello” co sekundę (1000 milisekund):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Zadzwoń displayHello co sekundę:
setInterval(displayHello, 1000);
Więcej przykładów poniżej.
Definicja i użycie
Metoda setInterval()
wywołuje funkcję w określonych odstępach czasu (w milisekundach).
Metoda setInterval()
kontynuuje wywoływanie funkcji do momentu
clearInterval()
wywołania lub zamknięcia okna.
1 sekunda = 1000 milisekund.
Notatka
Aby wykonać funkcję tylko raz, użyj setTimeout()
metody.
Aby wyczyścić interwał, użyj identyfikatora zwróconego przez setInterval():
myInterval = setInterval(function, milliseconds);
Następnie możesz zatrzymać wykonanie, wywołując clearInterval():
clearInterval(myInterval);
Zobacz też:
Składnia
setInterval(function, milliseconds, param1, param2, ...)
Parametry
Parameter | Description |
function | Required. The function to execute |
milliseconds | Required. The execution interval. If the value is less than 10, 10 is used |
param1, param2, ... | Optional. Additional parameters to pass to the function Not supported in IE9 and earlier. |
Wartość zwrotu
Rodzaj | Opis |
Numer | Identyfikator timera. Użyj tego identyfikatora z clearInterval(), aby anulować licznik czasu. |
Więcej przykładów
Przykład
Wyświetlaj czas jak zegarek cyfrowy:
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
Przykład
Używanie clearInterval() do zatrzymania cyfrowego zegarka:
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
Przykład
Używanie setInterval() i clearInterval() do tworzenia dynamicznego paska postępu:
function move() {
const element = document.getElementById("myBar");
let width = 0;
let id = setInterval(frame, 10);
function frame() {
if (width == 100) {
clearInterval(id);
} else {
width++;
element.style.width = width + '%';
}
}
}
Przykład
Przełączaj się między dwoma kolorami tła raz na 500 milisekund:
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
Przykład
Przekaż parametry do funkcji (nie działa w IE9 i wcześniejszych):
setInterval(myFunc, 2000, "param1", "param2");
Jeśli jednak korzystasz z funkcji anonimowej, działa ona we wszystkich przeglądarkach:
setInterval(function() {myFunc("param1", "param2")}, 2000);
Obsługa przeglądarki
setInterval()
jest obsługiwany we wszystkich przeglądarkach:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |