利用js中的switch...case循环做一个时钟

最新推荐文章于 2025-06-10 20:40:45 发布

qw1ko~

最新推荐文章于 2025-06-10 20:40:45 发布

阅读量951

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/Anansoul/article/details/86170152

本文介绍了一个使用JavaScript实现的实时更新的数字时钟，包括日期、星期和时间的显示。通过获取当前时间并转换为字符串格式，定时更新页面上的时钟显示。

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

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>时钟</title>
	<style type="text/css"></style>
	<script type="text/javascript">
		window.onload = function(){
			var oBox = document.getElementById('box');
			function timeGo(){
				var now = new Date();
				var year = now.getFullYear();//2018年
				var month = now.getMonth() + 1;
				var date = now.getDate();
				var week = now.getDay();
				var hour = now.getHours();
				var minute = now.getMinutes();
				var second = now.getSeconds();
				// alert(hour + ":" + minute + ":" + second);//15:33:9
				oBox.innerHTML = '当前时间是：' + year + '年' + toDouble(month) + '月' + toDouble(date) + '日 ' + toWeek(week) + ' ' + toDouble(hour) + ":" + toDouble(minute) + ":" + toDouble(second);
			}
			timeGo();
			setInterval(timeGo, 1000);
		}
		//此函数将星期的数字转为中文表示
		function toWeek(num){
			switch(num){
				case 0:
					return '星期天'; 
					break;
				case 1:
					return '星期一'; 
					break;
				case 2:
					return '星期二'; 
					break;
				case 3:
					return '星期三'; 
					break;
				case 4:
					return '星期四'; 
					break;
				case 5:
					return '星期五'; 
					break;
				case 6:
					return '星期六'; 
					break;
			}
		}
		function toDouble(num){
			if(num < 10){
				return '0' + num;
			}else{
				return num;
			}
		}
	</script>
</head>
<body>
	<div id="box"></div>
</body>
</html>

在这里插入图片描述