如何解决moment js 创建动态时钟
我使用 moment.js 和 moment-timezone-with-data
创建了时钟
时钟显示多个位置,仅在页面刷新时更新。
我想把时钟变成动态时钟,每分钟都在变化(不需要秒)
这是我的完整 JS 代码
const clocks = [
"Asia/Tel_Aviv","Europe/Budapest","Asia/Shanghai","Europe/London","America/New_York",];
let i = 0;
const titles = ["Tel Aviv","Valletta","Shanghai","London","Boston"];
const box = document.querySelector(".box");
box.append(
...clocks.map((timeZone) => {
const zone = document.createElement("div");
const time = document.createElement("div");
const cityTitle = document.createElement("h4");
zone.classList.add("zone");
time.classList.add("time","d-flex","justify-content-between");
// Creating box
zone.append(time,cityTitle);
time.append(
...Array.from(moment().tz(timeZone).format("HH:mm"),(character) => {
const span = Object.assign(document.createElement("span"),{
textContent: character,});
if (character === ":") {
span.classList.add("no-bg");
}
return span;
})
);
cityTitle.append(titles[i]);
i++;
return zone;
})
);
和唯一的 HTML:
<div class="box"></div>
这里是全盘 https://codepen.io/hamergil/pen/LYxQBqM
希望得到帮助 谢谢
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。