js中的date，定时任务

最新推荐文章于 2025-01-27 03:18:15 发布

hoho_12

最新推荐文章于 2025-01-27 03:18:15 发布

阅读量1.5k

点赞数

分类专栏： JavaScript Java Training 文章标签： js

本文链接：https://blog.youkuaiyun.com/hoho_12/article/details/52132081

版权

Java Training 同时被 2 个专栏收录

39 篇文章

订阅专栏

JavaScript

31 篇文章

订阅专栏

本文介绍如何使用JavaScript实现页面上的实时时间显示功能，并探讨了setInterval与setTimeout两种定时器的区别及应用。通过具体示例，展示了如何让页面元素动态更新当前时间。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>定时任务</title>
		<script type="text/javascript">
			//获取当前系统时间			
			function getCurrentTime() {
				var currentTime = new Date();

				var year = currentTime.getFullYear();
				var month = currentTime.getMonth();
				//日期
				var day = currentTime.getDate();
				//星期几
				var week = currentTime.getDay();

				var hourse = currentTime.getHours();
				var minutes = currentTime.getMinutes();
				var seconds = currentTime.getSeconds();

				var timeStr = year + "年" + (month + 1) + "月" + day + "日    " + hourse + ":" + minutes + ":" + seconds + "    星期" + week;
				return timeStr;
			}

			function showTime() {
				//首先找到id为time的元素
				var timeSpan = document.getElementById("time");

				//然后把当前时间设置为元素的内容
				timeSpan.innerHTML = getCurrentTime();
			}
			
			function showTime2(){
				var timeSpan = document.getElementById("time");

				timeSpan.innerHTML = getCurrentTime();
				
				//间隔一段时间后，重新调用showTime2()  当前方法
				setTimeout("showTime2()",500);
			}
		</script>
	</head>
	<!--    	
    	描述：定时任务：在间隔一段时间后，执行同一段代码
    	
    	每经过指定毫秒值后执行指定的代码（不断执行）
    	setInterval("代码",时间间隔)
    	
    	经过指定毫秒值后执行指定的代码（只执行一次）
    	setTimeout("代码",时间间隔)
    -->

	<body>
		<div style="width: auto; background-color: black;">
			<span style="color: white;">时间</span>
			<span id="time" style="color: white;"></span>
		</div>

		<script type="text/javascript">
			//设置定时任务
			//setInterval("showTime()", 500);
			
			showTime2();
		</script>
	</body>

</html>