以下是一个简单的HTML页面,它使用JavaScript来显示当前时间。JavaScript代码位于<script>
标签中,并使用setInterval
函数每秒更新一次时间。
<!DOCTYPE html>
<html>
<head>
<title>显示当前时间</title>
</head>
<body>
<h1 id="time">加载中...</h1>
<script>
function showTime() {
var date = new Date();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
// 确保小时、分钟和秒都是两位数
hours = hours < 10 ? "0" + hours : hours;
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
var time = hours + ":" + minutes + ":" + seconds;
document.getElementById("time").textContent = time;
}
// 立即显示时间,然后每秒更新一次
showTime();
setInterval(showTime, 1000);
</script>
</body>
</html>
这段代码首先定义了一个函数showTime
,该函数获取当前日期和时间,并从中提取小时、分钟和秒。然后,它确保这些值都是两位数(例如,将“9”更改为“09”)。最后,它将时间格式化为“HH:MM:SS”格式,并将其设置为页面上ID为“time”的元素的文本内容。
然后,它立即调用showTime
函数以显示当前时间,并使用setInterval
函数每秒调用一次showTime
函数,以便更新时间。