如何在网页上进行编辑以更改另一个网页上的显示

Question

这是我当前时钟设计的 HTML 和 Javascript。我希望能够更改自定义页面上的小时偏移，并将这些更改应用于时钟所在的显示页面。目前，我通过输入时区数据库名称或输入正确的时区偏移量来更改显示页面的偏移量。因此，简单来说，我试图更改从另一个网页输入的时区，并使其仍然显示在我的显示网页上。谢谢！

HTML 代码：

  <div class="timZonM" data-time-zone="Asia/Tehran" style="position: absolute; left: 10px; top:545px;"></div>
            <div class="timZonM" data-time-zone="Etc/GMT" style="position: absolute; left: 250px; top: 545px;"></div>
            <div class="timZonM" data-time-zone="Etc/GMT+4" data-seconds style="position: absolute; left:510px; top:580px;"></div>
            <div class="timZonM" data-time-zone="Etc/GMT-8"  style="position:absolute; left:920px; top:545px;"></div>
            <div class="timZonM" data-time-zone="Etc/GMT-14" style="position:absolute; left:1205px; top:545px;"></div>

Javascript代码：

const OptionsMilitary = { hour12:false, hour:'2-digit', minute:'2-digit', second:'2-digit' };

const MilitaryTime=(elm, dt)=>
  {
  let [hh,mm,ss] = dt.toLocaleString("en-US", {...OptionsMilitary, timeZone:elm.dataset.timeZone }).split(':')
  if ('seconds'in elm.dataset) elm.dataset.seconds = ':'+ss
  elm.textContent = (hh=='00'&&mm=='00') ? '2400' : (hh+mm).replace(/^24/, '00'); // specific browsers marmelade
  }

setInterval(() => {
  let dateTime = new Date();
  document.querySelectorAll('.timZonM').forEach(el=>MilitaryTime(el, dateTime));
}, 500);

Answer 1

要在网页上进行编辑以反映到另一个网页上，您需要：

使用共享组件：通过服务器端包含或基于组件的框架（例如 React 组件）实现通用元素（如页眉或页脚）。 应用全局样式：使用链接到两个页面的共享 CSS 文件来确保样式一致。 集中数据：将数据存储在中央位置（例如数据库）并在两个页面上动态检索。