案例：利用JS动态的显示当前时间

最新推荐文章于 2022-04-17 11:55:35 发布

田田田田__

最新推荐文章于 2022-04-17 11:55:35 发布

阅读量474

点赞数

CC 4.0 BY-SA版权

分类专栏： DOM

本文链接：https://blog.youkuaiyun.com/weixin_42061805/article/details/81507923

DOM 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的实时钟表功能，通过获取当前时间并格式化显示时、分、秒，同时利用计时器每500毫秒刷新时间显示，保持时间的实时更新。

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<input type="text" id="showTime"/>
<input type="button" onclick="clock()" value="getNowTime"/>
<script type="text/javascript">
		function clock(){
			
			//分别获取时分秒
			var date = new Date();
			var hours = date.getHours();
			var minu = date.getMinutes();
			var sed = date.getSeconds();
			
			//检查时间为个位数时，前面加0，如9---09
			hours = check(hours);
			minu = check(minu);
			sed = check(sed);
			
			var strDate = hours + ":" + minu + ":" + sed;
			var textTime = document.getElementById("showTime");
			
			//进行清空
			textTime.value = "";
			textTime.value = strDate;
			
			//计时器，每500ms刷新一次
			window.setTimeout("clock()","500");	
			}
			
		function check(date){
			if (0<=date && date <=9){
				date = "0" + date;
				return date;
				}
			else{
				return date;
				}
			}
</script>
</body>
</html>