将当前时间添加到我的页面上的特定部分

Adding the current time into a specific section on my page

本文关键字：定部 我的 时间 添加      更新时间：2023-09-26

所以我在HTML文件上制作了一个div id="time"，并将其定位，以便当前时间可以显示在我制作的边框内的网站左上角。所以我希望当前时间显示在我制作的网站左上角的边界内，但很难做到：

HTML文件：

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

我的js文件：

var time = document.getElementById("time")
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if (minutes < 10)
    minutes = "0" + minutes
var suffix = "AM";
if (hours >= 12) {
    suffix = "PM";
    hours = hours - 12;
}
if (hours == 0) {
    hours = 12;
}
document.write("<b>" + hours + ":" + minutes + " " + suffix + "</b>")

当前时间确实成功显示，但它没有显示在我想要的位置（它一直显示在页面底部）。也许DOM有什么问题？

试试这个：

var time = document.getElementById("time")
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if (minutes < 10)
minutes = "0" + minutes
var suffix = "AM";
if (hours >= 12) {
suffix = "PM";
hours = hours - 12;
}
if (hours == 0) {
hours = 12;
}
time.innerHTML = "<b>" + hours + ":" + minutes + " " + suffix + "</b>";
<div id="time">
</div>

使用time.innerHTML = '...'显示在div所在的位置。

关于document.write（）的一些词语

面向对象的JavaScript-第二版：方法document.write（）允许您在正在加载页面。你可以有如下代码：

<p>It is now
    <script>document.write("<em>" + new Date() + "</em>"); </script>
</p>

这与您直接在HTML文档如下：

<p>It is now 
    <em>Fri Apr 26 2013 16:55:16 GMT-0700 (PDT)</em> 
</p>

请注意，您只能在创建页面时使用document.write（）加载。如果您在页面加载后尝试，它将替换整个页面。很少需要document.write（），并且如果如果你认为你做到了，那就另辟蹊径吧。修改DOM级别1提供的页面内容是优选的，并且更加灵活。

这是您的解决方案。。您所要做的就是将document.getElementById（）放在div id="time"之后。它运行良好。

<html>
<head>
    <script>
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if (minutes < 10)
minutes = "0" + minutes
var suffix = "AM";
if (hours >= 12) {
suffix = "PM";
hours = hours - 12;
}
if (hours == 0) {
hours = 12;
}
    </script>
    </head>
    <body>
        <div id="time" style="position:absolute; bottom:0; right:0;">123
        </div>
    </body>
    <script>
        document.getElementById("time").innerHTML="<b>" + hours + ":" +minutes + " " + suffix + "</b>";
    </script>
</html>

您声明了vartime，但没有使用它。将time.inerHTML值设置为日期，而不是document.write:

time.innerHTML = "<b>"+ hours +":"+ minutes +" "+ suffix +"</b>";

通过这种方式，您可以将id为"time"的div放在您希望日期显示在页面上的任何位置

相关文章：