运用js让html自动更新时间

最新推荐文章于 2021-10-09 09:20:26 发布

cjj_jianjun

最新推荐文章于 2021-10-09 09:20:26 发布

阅读量1.6k

点赞数 1

分类专栏：前端_小技巧

本文链接：https://blog.csdn.net/cjj_jianjun/article/details/100088286

版权

前端_小技巧专栏收录该内容

5 篇文章 0 订阅

订阅专栏

运用js让html自动更新时间

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>dataDemo</title>
<style type="text/css">

</style>
</head>
<body>
	<div>
		当前时间：
		<input id="clock"></input>
	</div>
	
	<div>
		当前时间：
		<span id="dateString"></span>
	</div>
</body>
<script>
	
	// 每秒执行
	setInterval("setDate()",1000);
	// 设置时间
	function setDate(){
	  var t = new Date().format("yyyy-MM-dd hh:mm:ss");
	  document.getElementById("clock").value= t; 
	  document.getElementById("dateString").innerText = t + "";
	}
	
	/* 时间转换工具 */
	Date.prototype.format = function(fmt) {
		var o = {
			"M+": this.getMonth() + 1, //月份 
			"d+": this.getDate(), //日 
			"h+": this.getHours(), //小时 
			"m+": this.getMinutes(), //分 
			"s+": this.getSeconds(), //秒 
			"q+": Math.floor((this.getMonth() + 3) / 3), //季度 
			"S": this.getMilliseconds() //毫秒 
		};
		if (/(y+)/.test(fmt)) {
			fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
		}
		for (var k in o) {
			if (new RegExp("(" + k + ")").test(fmt)) {
				fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
			}
		}
		return fmt;
	}
</script>
</html>

cjj_jianjun

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
运用js让html自动更新时间

运用js让html自动更新时间<!DOCTYPE html><html><head><meta charset="UTF-8"><title>dataDemo</title><style type="text/css"></style></head><body&gt...
复制链接

扫一扫

专栏目录