在JavaScript中从头开始创建秒表

// HTML
<div id="timer">0:00:00</div>
<button id="start">开始</button>
<button id="stop">停止</button>
<button id="reset">重置</button>

// JavaScript
var startTime = null;
var interval = null;
var isRunning = false;

function startTimer() {
  if (!isRunning) {
    startTime = new Date().getTime();
    interval = setInterval(updateTimer, 10);
    isRunning = true;
  }
}

function stopTimer() {
  if (isRunning) {
    clearInterval(interval);
    isRunning = false;
  }
}

function resetTimer() {
  stopTimer();
  startTime = null;
  document.getElementById("timer").textContent = "0:00:00";
}

function updateTimer() {
  if (startTime) {
    var currentTime = new Date().getTime();
    var elapsedTime = currentTime - startTime;
    
    var hours = Math.floor(elapsedTime / 3600000);
    var minutes = Math.floor((elapsedTime % 3600000) / 60000);
    var seconds = Math.floor((elapsedTime % 60000) / 1000);
    var milliseconds = Math.floor((elapsedTime % 1000) / 10);
    
    document.getElementById("timer").textContent = hours + ":" + padZero(minutes) + ":" + padZero(seconds) + "." + padZero(milliseconds);
  }
}

function padZero(number) {
  return (number < 10 ? "0" : "") + number;
}

document.getElementById("start").addEventListener("click", startTimer);
document.getElementById("stop").addEventListener("click", stopTimer);
document.getElementById("reset").addEventListener("click", resetTimer);