创建WEb页面,有两个链接,查看当前日期和查看当前时间
时间: 2024-10-12 11:09:18 浏览: 7
创建一个Web页面包含两个链接,用于显示当前日期和当前时间,你可以使用HTML结构加上JavaScript来实现这个功能。下面是一个简单的示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>当前日期和时间</title>
<style>
a {
text-decoration: none;
color: blue;
}
</style>
</head>
<body>
<h1>当前信息</h1>
<p><a href="#" onclick="showDate()">点击获取当前日期</a></p>
<p><a href="#" onclick="showTime()">点击获取当前时间</a></p>
<div id="dateDisplay" style="display: none;">
<span id="currentDate"></span>
</div>
<div id="timeDisplay" style="display: none;">
<span id="currentTime"></span>
</div>
<script>
function showDate() {
var today = new Date();
document.getElementById('currentDate').innerText = today.toDateString();
document.getElementById('dateDisplay').style.display = "block";
}
function showTime() {
var today = new Date();
document.getElementById('currentTime').innerText = today.toLocaleTimeString();
document.getElementById('timeDisplay').style.display = "block";
}
</script>
</body>
</html>
```
在这个例子中,当用户点击“获取当前日期”链接时,`showDate`函数会被触发,它会获取当前日期并将其显示在id为`currentDate`的元素中;同样,点击“获取当前时间”链接时,`showTime`函数会显示当前时间。
阅读全文