JavaScript学习之动态显示时间

最新推荐文章于 2022-08-02 17:48:10 发布

HARE-YOU

最新推荐文章于 2022-08-02 17:48:10 发布

阅读量287

点赞数 1

分类专栏：前端文章标签： HTML JavaScript JavaWeb

本文链接：https://blog.csdn.net/qq_40380777/article/details/79857163

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

动态显示时间

第一步：得到当前时间。

第二步：格式化当前时间。

第三步：获取标签。

第四步：使用innerHTML属性向标签里写入时间。

第五步：使用定时器每一秒向标签里写入时间。

setInterval("方法名；"，每隔几秒执行一次）

示例：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>动态时间显示</title>
		<style type="text/css">
			#divid {
				width: 200px;
				height: 150px;
				border: 2px dashed chartreuse;
			}
		</style>
	</head>
	<body>
		<div id="divid">
			
		</div>
		<script type="text/javascript">
			function getDate(){
				//获取时间
				var date = new Date();
				//格式化时间
				var time = date.toLocaleString();
				//获取div标签
				var div1 = document.getElementById("divid");
				//向div标签里写入时间
				div1.innerHTML = time;
			}
			//每隔一秒设置一次
			setInterval("getDate();",1000);
		</script>
	</body>
</html>