Window setInterval ()
Các ví dụ
Hiển thị "Xin chào" mỗi giây (1000 mili giây):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Hiển thị cuộc gọi Xin chào mỗi giây:
setInterval(displayHello, 1000);
Thêm ví dụ bên dưới.
Định nghĩa và Cách sử dụng
Phương setInterval()
thức này gọi một hàm trong các khoảng thời gian xác định (tính bằng mili giây).
Phương setInterval()
thức tiếp tục gọi hàm cho đến khi
clearInterval()
được gọi, hoặc cửa sổ bị đóng.
1 giây = 1000 mili giây.
Ghi chú
Để thực thi hàm chỉ một lần, hãy sử dụng setTimeout()
phương thức này để thay thế.
Để xóa một khoảng thời gian, hãy sử dụng id được trả về từ setInterval ():
myInterval = setInterval(function, milliseconds);
Sau đó, bạn có thể dừng việc thực thi bằng cách gọi clearInterval ():
clearInterval(myInterval);
Xem thêm:
Cú pháp
setInterval(function, milliseconds, param1, param2, ...)
Thông số
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. |
Giá trị trả lại
Loại | Sự miêu tả |
Một số | Id của bộ hẹn giờ. Sử dụng id này với clearInterval () để hủy bộ đếm thời gian. |
Các ví dụ khác
Thí dụ
Hiển thị thời gian như một chiếc đồng hồ kỹ thuật số:
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
Thí dụ
Sử dụng clearInterval () để dừng đồng hồ kỹ thuật số:
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
Thí dụ
Sử dụng setInterval () và clearInterval () để tạo thanh tiến trình động:
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 + '%';
}
}
}
Thí dụ
Chuyển đổi giữa hai màu nền cứ sau 500 mili giây một lần:
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
Thí dụ
Truyền các tham số cho hàm (không hoạt động trong IE9 trở về trước):
setInterval(myFunc, 2000, "param1", "param2");
Tuy nhiên, nếu bạn sử dụng một chức năng ẩn danh, nó hoạt động trên tất cả các trình duyệt:
setInterval(function() {myFunc("param1", "param2")}, 2000);
Hỗ trợ trình duyệt
setInterval()
được hỗ trợ trong tất cả các trình duyệt:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |