Sự kiện thời gian JavaScript
|
1
2
3
4
5
6
7
số 8
9
10
11
12
|
JavaScript có thể được thực thi trong các khoảng thời gian. Đây được gọi là sự kiện thời gian. |
Thời gian sự kiện
Đối windowtượng cho phép thực thi mã trong các khoảng thời gian xác định.
Những khoảng thời gian này được gọi là sự kiện thời gian.
Hai phương pháp chính để sử dụng với JavaScript là:
setTimeout(function, milliseconds)
Thực thi một chức năng, sau khi đợi một số mili giây được chỉ định.setInterval(function, milliseconds)
Tương tự như setTimeout (), nhưng lặp lại việc thực thi hàm liên tục.
Và setTimeout()đều setInterval()là các phương thức của đối tượng HTML DOM Window.
Phương thức setTimeout ()
window.setTimeout(function, milliseconds);
Phương window.setTimeout()thức có thể được viết mà không có tiền tố cửa sổ.
Tham số đầu tiên là một hàm được thực thi.
Tham số thứ hai cho biết số mili giây trước khi thực thi.
Thí dụ
Nhấp vào một nút. Chờ 3 giây và trang sẽ thông báo "Xin chào":
<button onclick="setTimeout(myFunction, 3000)">Try it</button>
<script>
function myFunction() {
alert('Hello');
}
</script>
Làm thế nào để Ngừng Thực hiện?
Phương clearTimeout()thức dừng việc thực thi hàm được chỉ định trong setTimeout ().
window.clearTimeout(timeoutVariable)
Phương window.clearTimeout()thức có thể được viết mà không có tiền tố cửa sổ.
Phương clearTimeout()thức sử dụng biến được trả về từ setTimeout():
myVar = setTimeout(function, milliseconds);
clearTimeout(myVar);
Nếu hàm chưa được thực thi, bạn có thể dừng việc thực thi bằng cách gọi clearTimeout()
phương thức:
Thí dụ
Ví dụ tương tự như trên, nhưng có thêm nút "Dừng":
<button onclick="myVar = setTimeout(myFunction, 3000)">Try it</button>
<button onclick="clearTimeout(myVar)">Stop it</button>
Phương thức setInterval ()
Phương setInterval()thức lặp lại một hàm đã cho tại mỗi khoảng thời gian nhất định.
window.setInterval(function, milliseconds);
Phương window.setInterval()thức có thể được viết mà không có tiền tố cửa sổ.
Tham số đầu tiên là hàm được thực thi.
Tham số thứ hai cho biết độ dài của khoảng thời gian giữa mỗi lần thực hiện.
Ví dụ này thực thi một chức năng được gọi là "myTimer" mỗi giây một lần (giống như đồng hồ kỹ thuật số).
Thí dụ
Hiển thị thời gian hiện tại:
setInterval(myTimer, 1000);
function myTimer() {
const d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
Có 1000 mili giây trong một giây.
Làm thế nào để Ngừng Thực hiện?
Phương clearInterval()thức dừng việc thực thi hàm được chỉ định trong phương thức setInterval ().
window.clearInterval(timerVariable)
Phương window.clearInterval()thức có thể được viết mà không có tiền tố cửa sổ.
Phương clearInterval()thức sử dụng biến được trả về từ setInterval():
let myVar = setInterval(function, milliseconds);
clearInterval(myVar);
Thí dụ
Tương tự như ví dụ trên, nhưng chúng tôi đã thêm nút "Dừng thời gian":
<p id="demo"></p>
<button onclick="clearInterval(myVar)">Stop time</button>
<script>
let myVar = setInterval(myTimer, 1000);
function myTimer() {
const d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
</script>