窗口加载时启动计时器

Question

我有一些代码,下面是一个前进计时器,当我按下开始它开始以hh/mm/ss计数,当我按下显示时间时,它显示标签内的hh/mm/ss时间,并重置计数器单击按钮时为零,从零开始计数.

我的问题是计时器最初只在我按下开始按钮时启动.

我想在窗口加载时自动启动计时器并删除开始按钮.

怎么可以实现？

window.onload = () => {
  let hour = 0;
  let minute = 0;
  let seconds = 0;
  let totalSeconds = 0;

  let intervalId = null;

  function startTimer() {
    ++totalSeconds;
    hour = Math.floor(totalSeconds / 3600);
    minute = Math.floor((totalSeconds - hour * 3600) / 60);
    seconds = totalSeconds - (hour * 3600 + minute * 60);

    document.getElementById("hour").innerHTML = hour;
    document.getElementById("minute").innerHTML = minute;
    document.getElementById("seconds").innerHTML = seconds;
  }

  document.getElementById('start-btn').addEventListener('click', () => {
    intervalId = setInterval(startTimer, 1000);
  })

  document.getElementById('Displplaytimetaken').addEventListener('click', () => {
    document.getElementById("timetaken").innerHTML = minute + "minutes" + seconds + "seconds";
    reset();
  });

  function reset() {
    totalSeconds = 0;
    document.getElementById("hour").innerHTML = '0';
    document.getElementById("minute").innerHTML = '0';
    document.getElementById("seconds").innerHTML = '0';
  }

}

<h1 style="font-size:24px;">Time Taken:
  <h1 id="timetaken"></h1>

  <button id="start-btn">Start</button>
  <button id="Displplaytimetaken">Display time taken</button>

Answer 1

window.onload = () => {
  let hour = 0;
  let minute = 0;
  let seconds = 0;
  let totalSeconds = 0;

  let intervalId = null;

intervalId = setInterval(startTimer, 1000);
  function startTimer() {
    ++totalSeconds;
    hour = Math.floor(totalSeconds / 3600);
    minute = Math.floor((totalSeconds - hour * 3600) / 60);
    seconds = totalSeconds - (hour * 3600 + minute * 60);

    document.getElementById("hour").innerHTML = hour;
    document.getElementById("minute").innerHTML = minute;
    document.getElementById("seconds").innerHTML = seconds;
  }

  

  document.getElementById('Displplaytimetaken').addEventListener('click', () => {
    document.getElementById("timetaken").innerHTML = minute + "minutes" + seconds + "seconds";
    reset();
  });

  function reset() {
    totalSeconds = 0;
    document.getElementById("hour").innerHTML = '0';
    document.getElementById("minute").innerHTML = '0';
    document.getElementById("seconds").innerHTML = '0';
  }

}

<h1 style="font-size:24px;">Time Taken:
  <h1 id="timetaken">

  </h1>

  <h2>    <span id="hour"></span>
    <span id="minute"></span>
    <span id="seconds"></span>
  </h2>

  <button id="Displplaytimetaken">Display time taken</button>

运行它,希望你的问题得到解决.