HTML+JS实现动态设置标签内容之显示时间

最新推荐文章于 2022-11-09 20:48:57 发布

你的大数据学长

最新推荐文章于 2022-11-09 20:48:57 发布

阅读量4.6k

点赞数 4

分类专栏： HTML 文章标签： java js javascript css

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/qq_43198568/article/details/104347690

版权

HTML 专栏收录该内容

22 篇文章 9 订阅

订阅专栏

HTML+JS实现动态设置标签内容之显示时间

代码
关键代码解释
- setInterval()
- Date 对象
结果展示

代码

该代码可在我的GitHub中找到，链接在此

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>动态设置标签内容</title>
</head>
<body>
    <span id="clock"></span>
    <script>
        var int = self.setInterval("clock()", 50);
        function clock()
        {
            var t = new Date();
            document.getElementById("clock").innerText = t;
        }
    </script>
    <button onclick="int=window.clearInterval(int)">Stop interval</button>
</body>
</html>

关键代码解释

setInterval()

setInterval()的定义和用法
setInterval()方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval()方法会不停地调用函数，直到clearInterval()被调用或窗口被关闭。由setInterval()返回的ID值可用作clearInterval()方法的参数。

Date 对象

Date 对象用于处理日期和时间。

结果展示

时间每50毫秒会自动更新一次
在这里插入图片描述

点击Stop interval，页面将不再变化

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。