Question

我正在使用专有软件来创建我需要显示的页面（主要是HVAC控件）日期和时间。该软件有一个“自定义html”块（注释“此内容将保存在<html>和<body>标签内的单独HTML文件中”，我将代码放入其中。

经过一些研究（我不是编码器并且主要是复制粘贴），我粘贴到所述块中的代码如下：

<script language="javascript"> 
    var t = new Date(); 
    document.write(t.toDateString()+""+t.getHours()+":"+t.getMinutes()); 
</script>

这让我非常接近我想要的东西（日，月，日，年，时间）。我更喜欢我能获得AM / PM，但主要是我想要的是自动更新的日期/时间，因此用户无需在获得准确的打印输出之前刷新页面。

虽然我在这个网站上看到许多线程致力于自动更新时间/日期，但我不确定如何将它们中的任何一个与我正在使用的系统集成（我已经有一段时间了，所以我想我会用我正在处理的背景问这个问题。

Answer 1

这不是您想要的确切格式，但提供了不同的方式来实现您的需求。使用一些字符串操作，您可以实现相同。如果你可以分享你想要显示的确切格式，我可以修改解决方案。

使用setTimeout()或setInterval()不断对用户的屏幕进行更改通常会导致“布局颠簸”，即心脏骤停的浏览器版本，在用户before被迫执行页面之前不必要的回流屏幕在物理上能够显示更改。这是非常糟糕的，因为页面重排的税收性质，特别是在问题最明显的移动设备上，页面加载和电池耗尽。

出于上述原因requestAnimationFrame()被引入。简而言之，该方法允许您在下一个可用的屏幕重绘上执行代码，使猜测工作与用户的浏览器和硬件准备就绪，以对屏幕进行更改。当我们反复调用requestAnimationFrame()来创建屏幕更新时，我们可以确保在用户的计算机实际准备好每次更改屏幕时调用我们的更新代码，从而实现更顺畅，更有效的更新。此外，通过requestAnimationFrame()调用并在浏览器中的后台选项卡内运行的代码会自动暂停或减速（每秒2帧或更少）以进一步节省用户系统资源 - 运行屏幕更新毫无意义那是没有被看到的。

(function updateTime() {
  var time = (new Date()).toLocaleString({
    hour12: true,
  });
  
  document.getElementById('current_time').innerHTML = time;
  
  requestAnimationFrame(updateTime);
})();

<div id="current_time"></div>

Answer 2

setInterval(function(){
    var t = new Date(); 
    document.write(t.toDateString()+""+t.getHours()+":"+t.getMinutes()); 
}, 1000);

每秒运行一次你的脚本，不幸的是，这并没有摆脱过去，所以我建议你有一个占位符，你可以更新像html span元素。

<span id="time"></span>
<script>
setInterval(function(){
        var t = new Date(); 
        document.getElementById("time").innerHTML =
            (t.toDateString()+""+t.getHours()+":"+t.getMinutes()); 
    }, 1000);
</script>

现在，你的时钟需要一些格式化，因为现在，如果时间是11:05，它会显示11：5。我会检查here

希望这适用于您的系统。

在专有软件{J}中对Javascript进行日期/时间自动更新

2 个答案: