html如何设置时间刷新按钮

最新推荐文章于 2024-07-15 07:00:00 发布

木木子！

最新推荐文章于 2024-07-15 07:00:00 发布

阅读量763

点赞数 1

本文链接：https://blog.csdn.net/qq_43279782/article/details/106344268

版权

**要求：
**从系统获取时间，设置一个按钮，可以用于刷新时间，从而改变时间。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>动态显示时间</title>
	<script>
				function refreshTime() {
					var dateStr;
					var date = new Date();
					dateStr = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
					var dateLabelObj = document.getElementById("dateLabel");
					console.log(dateStr);
					dateLabelObj.innerHTML = dateStr;
				}
			</script>
	</head>
	<body onload="refreshTime()">
	<h1>你好，现在是北京时间：</h1>
	<span id="dateLabel">
		
	</span>
	<input type="button" value="刷新"  onclick="refreshTime()">
	</body>
</html>

实验结果：
在这里插入图片描述