gpt4 book ai didi

javascript - 添加多个时区的多个时钟

转载 作者:行者123 更新时间:2023-11-28 12:18:25 25 4
gpt4 key购买 nike

我在 html 页面中有一个表格,其中包含全国各地的站点。我想在每个站点添加一个包含当前时间的列。

我需要解决三个问题。首先是如何在同一页面上有多个时钟。其次是让它们位于不同的时区。第三是处理夏令时。

我尝试了几种不同的 html 和 JavaScript 时钟,但无法显示多个实例。

我已经弄清楚如何修改时钟以增加或减少小时,但我还没有弄清楚如何同时显示不同的时钟。

其中一个站点位于亚利桑那州,那里不实行夏令时。因此,最好使用像 Moment Timezone 这样的东西来控制不同的时钟。

我对 JavaScript 的理解非常有限,所以我真的需要一些帮助来解决这个问题。我真的没有找到任何东西可以告诉我如何用足够简单的语言来解决我的问题,让我能够理解。

最佳答案

您可以使用Date.toLocaleTimeString()并在 options 参数中提供时区:

const clocks = document.getElementsByClassName("clock");

function updateClocks() {
for (let clock of clocks) {
let timezone = clock.dataset.timezone;
let time = new Date().toLocaleTimeString("en-US", {
hour: '2-digit',
minute:'2-digit',
timeZone: timezone
});
clock.textContent = time;
}
}

// Update every minute:
setInterval(updateClocks, 60000);
updateClocks();
.clock {
font-family: sans-serif;
border: thin solid;
border-radius: 10px;
padding: 5px;
}
<p>New York: <span class="clock" data-timezone="America/New_York"></span></p>
<p>Shanghai: <span class="clock" data-timezone="Asia/Shanghai"></span></p>
<p>Berlin: <span class="clock" data-timezone="Europe/Berlin"></span></p>

关于javascript - 添加多个时区的多个时钟,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44081155/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com