以下是一个简单的基于HTML+JS的动态网页示例,它会在页面上显示当前的时间和日期,并且每隔1秒钟更新一次。

<!DOCTYPE html>
<html>
<head>
	<title>动态网页示例</title>
	<script type="text/javascript">
		// 定义一个函数,用于在网页上显示当前时间
		function showTime() {
			// 获取当前时间
			var now = new Date();
			// 将时间转换成字符串,格式为'hh:mm:ss'
			var timeString = now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds();
			// 将时间字符串显示在网页上
			document.getElementById('time').innerHTML = timeString;
		}

		// 定义一个函数,用于在网页上显示当前日期
		function showDate() {
			// 获取当前日期
			var now = new Date();
			// 将日期转换成字符串,格式为'yyyy年mm月dd日'
			var dateString = now.getFullYear() + '年' + (now.getMonth()+1) + '月' + now.getDate() + '日';
			// 将日期字符串显示在网页上
			document.getElementById('date').innerHTML = dateString;
		}

		// 在页面加载完成后执行showTime和showDate函数
		window.onload = function() {
			showTime();
			showDate();
			// 每隔1秒钟更新一次时间和日期
			setInterval(showTime, 1000);
			setInterval(showDate, 1000);
		}
	</script>
</head>
<body>
	<h1>动态网页示例</h1>
	<p>当前时间:<span id="time"></span></p>
	<p>当前日期:<span id="date"></span></p>
</body>
</html>

这个网页会在页面上显示当前的时间和日期,并且每隔1秒钟更新一次。这是通过JavaScript中的setInterval函数实现的。在页面加载完成后,会自动执行showTime和showDate函数来显示当前的时间和日期。同时,页面中有两个span标签分别用于显示时间和日期,在JavaScript中使用document.getElementById函数获取这两个标签,并将时间和日期字符串设置为它们的innerHTML属性,从而实现在页面上显示时间和日期的效果。


原文地址: https://www.cveoy.top/t/topic/lUBO 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录