在网页中插入时间自动更新

网页时间自动更新

最新推荐文章于 2023-06-12 22:01:32 发布

原创最新推荐文章于 2023-06-12 22:01:32 发布 · 2.7k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#JavaScript

笔记之类的同时被 2 个专栏收录

77 篇文章

订阅专栏

Java Script

11 篇文章

订阅专栏

本文介绍了一种使用JavaScript在网页上实现实时更新日期和时间的方法。通过设置定时器每秒更新一次时间显示，确保时间始终保持最新状态。适用于需要在页面上展示实时时间的应用场景。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>在网页中插入时间 自动更新</title>
</head>
<body>
<span id="sp_time"></span>
<script type="text/javascript">
setInterval(function(){
	var dd = new Date();
	var y = dd.getFullYear();
	var m = dd.getMonth() + 1;
	var d = dd.getDate();
	var h = dd.getHours();
	var mi = dd.getMinutes();
	var s = dd.getSeconds();
	var str = y + "年" + m + "月" + d + "日&nbsp;&nbsp;" + h + ":" + mi + ":" + s + "&nbsp;&nbsp;星期" + "日一二三四五六".charAt(dd.getDay());
	document.getElementById("sp_time").innerHTML = str;
},1000);
</script>
</body>
</html>


    function show(){
        var dd = new Date();
        var y = dd.getFullYear();
        var m = dd.getMonth() + 1;
        var d = dd.getDate();
        var h = dd.getHours();
        var mi = dd.getMinutes();
        var s = dd.getSeconds();
        var str = y + "年" + m + "月" + d + "日&nbsp;&nbsp;" + h + ":" + mi + ":" + s + "&nbsp;&nbsp;星期" + "日一二三四五六".charAt(dd.getDay());
        document.getElementById("sp_time").innerHTML = str;
    }
    setInterval(show,1000);
时间：<span id="sp_time"></span>