书香雅阁论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 564|回复: 0

【js显示实时时间】

[复制链接]

365

主题

388

帖子

158万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
1581264
发表于 2023-1-17 20:29:15|字数:908 | 显示全部楼层 |阅读模式
LV10 站长

    比如我们想在网页上显示当前的实时时间,那么我们需要2步
    1:确定载体(时间由哪个html组件来显示)
    2:使用js每秒修改一次该组件的值

第1步不用过多讲解,大家应该都能看懂了
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CountDown</title>
</head>
<body>
    <span class="time">当前时间由我来显示</span>

</body>
</html>


第2步是写js,js是写在body里面的,使用<script>组件(标签)
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CountDown</title>
</head>
<body>
    <span id="box">当前时间由我来显示</span>   <!-- 这个组件(标签)的id是box -->
    <script type="text/javascript">
            var box = document.getElementById("box");   //读取id为box的组件到box变量里面

            setInterval("GetTime()",1000);   //这是一个定时器,表示每隔1000毫秒(1秒)执行一次子程序GetTime()

               function GetTime() {
                    let time = new Date();  //获取当前的系统时间相关
                    box.innerHTML = time.toLocaleString();  //让id为box的组件显示当前结果  如显示:2023/1/17 20:37:08
            }
    </script>
</body>
</html>



(点击返回课程目录https://shuxiangyage.net/forum.php?mod=viewthread&tid=1134
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|小黑屋|书香雅阁论坛 ( 湘ICP备17011672号-3 )

GMT+8, 2024-3-28 16:59 , Processed in 0.078378 second(s), 24 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表