div 显示时间

最新推荐文章于 2024-03-25 22:03:05 发布

代码帮

最新推荐文章于 2024-03-25 22:03:05 发布

阅读量628

点赞数 4

分类专栏：前端文章标签：前端 javascript html

本文链接：https://blog.csdn.net/ITLearnHall/article/details/135030672

版权

本文介绍如何使用JavaScript获取并实时更新HTML中的div元素显示当前时间，包括使用setInterval函数每秒刷新时间，以及自定义样式选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如果你想要在页面上使用 div 元素来显示当前时间，你可以使用 JavaScript 来获取当前时间并将其更新到 div 中。以下是一个简单的示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Display Time</title>
    <style>
        /* 在这里添加样式，例如字体、大小等 */
        #time-display {
            font-size: 20px;
            font-family: Arial, sans-serif;
            color: #333;
        }
    </style>
</head>
<body>
    <div id="time-display"></div>

    <script>
        // 更新时间并显示在 div 中
        function updateTime() {
            var currentTime = new Date();
            var hours = currentTime.getHours();
            var minutes = currentTime.getMinutes();
            var seconds = currentTime.getSec