js 显示时间

// 获取当前时间并显示在网页上

// 1. 创建一个函数来获取当前时间
function displayTime() {
    // 创建一个新的 Date 对象，它表示当前的日期和时间
    const now = new Date();

    // 使用 toLocaleTimeString 方法将时间格式化为本地时间字符串
    const currentTime = now.toLocaleTimeString();

    // 获取页面中用于显示时间的元素（假设有一个 id 为 'time' 的元素）
    const timeElement = document.getElementById('time');

    // 将获取到的时间字符串设置为该元素的内容
    if (timeElement) {
        timeElement.textContent = currentTime;
    }
}

// 2. 设置定时器，每秒更新一次时间
setInterval(displayTime, 1000);

// 3. 立即调用一次 displayTime 函数，确保页面加载时立即显示当前时间
displayTime();

解释说明：

• Date 对象：new Date() 用于获取当前的日期和时间。
• toLocaleTimeString()：将时间格式化为本地时间字符串，方便用户阅读。
• getElementById()：通过元素的 ID 获取 HTML 元素，这里假设页面中有一个 id="time" 的元素用于显示时间。
• setInterval()：每隔 1 秒调用一次 displayTime 函数，确保时间实时更新。
• textContent：将获取到的时间字符串设置为指定 HTML 元素的内容。

如果你在 HTML 文件中有一个如下的元素：

<div id="time"></div>

这段代码将会在页面上实时显示当前的时间。