Computer >> Máy Tính >  >> Lập trình >> HTML

Thuộc tính sự kiện HTML DOM timeStamp

Thuộc tính HTML DOM timeStamp trả về thời gian đã trôi qua tính bằng mili giây kể từ khi sự kiện được tạo hoặc kích hoạt.

Lưu ý:TimeStamp chỉ hoạt động nếu hệ thống sự kiện hỗ trợ nó cho một sự kiện cụ thể.

Sau đây là cú pháp -

Trả về giá trị thời gian (tính bằng mili giây)

event.timeStamp

Hãy để chúng tôi xem ví dụ về HTML DOM timeStamp tài sản -

Ví dụ

<!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>Danger</h2></div>
         <div id="lower"><h2>Danger</h2></div>
         </div>
         <input type="button" id="start" value="Start" 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 = 'Keep Going!';
            if(x === 439){
               divDisplay.textContent = 'Congrats! You Did it in '+event.timeStamp+' milliseconds';
               gameDisplay.removeEventListener('mousemove', playGame);
            }
         }
         else{
            divDisplay.textContent = 'You moved to DANGER area. You loose!';
            gameDisplay.removeEventListener('mousemove', playGame);
         }
   }
   function gameStart(){
      gameDisplay.addEventListener('mousemove',playGame);
   }
</script>
</body>
</html>

Đầu ra

Sau khi nhấp vào ‘Bắt đầu’ nút và con trỏ trong vùng màu xanh lục (an toàn) -

Thuộc tính sự kiện HTML DOM timeStamp

Sau khi nhấp vào ‘Bắt đầu’ nút và con trỏ ở cuối vùng màu xanh lục (an toàn) -

Thuộc tính sự kiện HTML DOM timeStamp

Sau khi nhấp vào ‘Bắt đầu’ nút và con trỏ trong khu vực màu đỏ (nguy hiểm) -

Thuộc tính sự kiện HTML DOM timeStamp