Thuộc tính timeStamp trong HTML DOM trả về thời gian trôi qua tính bằng mili-giây từ khi sự kiện được tạo hoặc kích hoạt.
Lưu ý: Thuộc tính timeStamp chỉ hoạt động nếu hệ thống sự kiện hỗ trợ nó cho sự kiện cụ thể đó.
Cú pháp
event.timeStamp
Ví dụ
Dưới đây là ví dụ minh họa thuộc tính HTML DOM timeStamp:
<!DOCTYPE html>
<html>
<head>
<title>timeStamp Event</title>
<style>
* { padding: 2px; margin: 5px; }
form { width: 70%; margin: 0 auto; text-align: center; }
#outer { width: 70%; margin: 0 auto; padding: 0; text-align: center; border: 1px solid black; height: 105px; background-color: #28a745; }
input[type="button"] { border-radius: 10px; }
#upper { border-bottom: 1px solid black; height: 40px; margin: 0 0 15px 0; background-color: #DC3545; }
#lower { border-top: 1px solid black; height: 40px; margin: 15px 0 0 0; background-color: #DC3545; }
</style>
</head>
<body>
<form>
<fieldset>
<legend>timeStamp-Event</legend>
<div id="outer">
<div id="upper"><h2>Nguy Hiểm</h2></div>
<div id="lower"><h2>Nguy Hiểm</h2></div>
</div>
<input type="button" id="start" value="Bắt Đầu" onclick="gameStart()">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
var divDisplay = document.getElementById('divDisplay');
var gameDisplay = document.getElementById('outer');
function playGame(event) {
var x = event.clientX;
var y = event.clientY;
if (y > 95 && y < 110) {
divDisplay.textContent = 'Tiếp Tục!';
if (x === 439) {
divDisplay.textContent = 'Chúc Mừng! Bạn Làm Được Trong ' + event.timeStamp + ' mili-giây';
gameDisplay.removeEventListener('mousemove', playGame);
}
} else {
divDisplay.textContent = 'Bạn Di Chuyển Vào Khu VỰC NGUY HIỂM. Bạn Thua!';
gameDisplay.removeEventListener('mousemove', playGame);
}
}
function gameStart() {
gameDisplay.addEventListener('mousemove', playGame);
}
</script>
</body>
</html>
Kết quả
Sau khi nhấn nút 'Bắt Đầu' và con trỏ ở khu vực xanh (an toàn):
Sau khi nhấn nút 'Bắt Đầu' và con trỏ ở cuối khu vực xanh (an toàn):
Sau khi nhấn nút 'Bắt Đầu' và con trỏ ở khu vực đỏ (nguy hiểm):
