JavaScript 在自动计数器中获取时钟时间

在自动计数器中获取时钟时间是 JavaScript 常见的应用场景，本文将介绍如何使用 JavaScript 获取当前的时间并在自动计数器中展示。

获取当前时间

使用 JavaScript 获取当前时间的方法有很多种，这里我们介绍其中两种方式：

1. 使用 Date() 对象

const currentDate = new Date();
const hours = currentDate.getHours();
const minutes = currentDate.getMinutes();
const seconds = currentDate.getSeconds();

2. 使用 Date.now()

const currentTime = Date.now();
const dateObject = new Date(currentTime);
const hours = dateObject.getHours();
const minutes = dateObject.getMinutes();
const seconds = dateObject.getSeconds();

自动计数器

自动计数器是一个常见的应用场景，可以实现如下效果：

00:00:01
00:00:02
00:00:03

实现这个效果需要使用 JavaScript 定时器 setInterval()，设置定时器每 1 秒执行一次，然后根据获取的当前时间更新计数器的数值。

let hours = 0;
let minutes = 0;
let seconds = 0;

setInterval(() => {
  seconds++;

  if (seconds === 60) {
    minutes++;
    seconds = 0;
  }

  if (minutes === 60) {
    hours++;
    minutes = 0;
  }

  const timeString =
    (hours < 10 ? "0" + hours : hours) +
    ":" +
    (minutes < 10 ? "0" + minutes : minutes) +
    ":" +
    (seconds < 10 ? "0" + seconds : seconds);
  
  document.getElementById("counter").innerText = timeString;
}, 1000);

上述代码中，我们定义了一个 setInterval() 函数，每秒更新一次计数器数值，并将数值输出到 id 为 "counter" 的元素中。

总结

本文介绍了如何使用 JavaScript 获取当前时间，并在自动计数器中展示。我们学习了两种获取时间的方法，以及如何使用定时器实现自动计数器。通过应用这些技巧，我们可以轻松地实现各种时间相关的功能。