网页实时时间显示与暂停功能-优快云博客

本文链接：https://blog.youkuaiyun.com/Gadxiong/article/details/80455425

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>每秒刷新时间显示时间</title>
	</head>
	<body οnlοad="showtime()">
		<div><font size="7">你好，欢迎访问贵美商城</font></div>
		<div><font size="7"  id="div1"></font></div>
		<!--<input type="button" id="but" οnclick="showtime()" value="显示当前时间"/>-->
		<input type="button" id="ant" οnclick="an()" value="暂停" />
		<script>
			var siv;
			var m;
			var but = document.getElementById("div1");
			var ant = document.getElementById("ant");
			function showtime(){
				siv = setInterval(function(){
					var data = new Date();
					var year = data.getFullYear();//年
					var month = data.getMonth();//月
					var day = data.getDate();//日
					var Week = data.getDay();//星期几
					var hour = data.getHours();//时
					var mins = data.getMinutes();//分
					var secs = data.getSeconds();//秒
					if(hour>=12){
						hour=hour-12;
						m="PM";
					}else{
						m="AM";
					}
					but.innerText=year+"年"+month+"月"+day+"日		"+hour+":"+mins+":"+secs+"	"+m+"	星期"+Week;
				},1000)
			}
			function an(){
				if(ant.value=="暂停"){
					clearInterval(siv);
					ant.value="继续";
				}else if(ant.value=="继续"){
					showtime();
					ant.value="暂停";
				}
				
			}
		</script>
	</body>
</html>