zhensolid
/
Python-100-Days


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>显示时间日期</title>
		<style>
			#clock {
				color: white;
				text-align: center;
				position: absolute;
				right: 10px;
				top: 10px;
				width: 280px;
				height: 40px;
				background-color: blue;
				font: 16px/40px "pt mono";
			}
		</style>
	</head>
	<body>
		<div id="clock"></div>
		<script>
			// JavaScript - 面向对象编程
			// 定义类创建对象
			const clockDiv = document.getElementById('clock')
			const weekdays = ['日', '一', '二', '三', '四', '五', '六']
			
			function showClock() {
				let now = new Date()
				let year = now.getFullYear()
				let mon = now.getMonth() + 1
				mon = mon < 10 ? '0' + mon : '' + mon
				let date = now.getDate()
				date = date < 10 ? '0' + date : '' + date
				let hour = now.getHours()
				hour = hour < 10 ? '0' + hour : '' + hour
				let min = now.getMinutes()
				min = min < 10 ? '0' + min : '' + min
				let sec = now.getSeconds()
				sec = sec < 10 ? '0' + sec : '' + sec
				let day = now.getDay()
				let fullStr = `${year}年${mon}月${date}日 
					${hour}:${min}:${sec} 星期${weekdays[day]}`
				clockDiv.textContent = fullStr
			}
			
			showClock()
			setInterval(showClock, 1000)
			// var timerId = setInterval(showClock, 1000)
			// clearInterval(timerId)
		</script>
	</body>
</html>