JS中点击“显示当前日期”按钮,点击后按钮下方显示当前日期
时间: 2024-11-05 13:25:25 浏览: 12
js隐藏与显示回到顶部按钮及[removed]事件应用
在JavaScript中,你可以通过HTML创建一个按钮,并结合JavaScript的`Date`对象来实现这个功能。首先,你需要在HTML中添加一个按钮元素以及用于显示日期的DOM元素:
```html
<button onclick="showCurrentDate()">显示当前日期</button>
<div id="dateDisplay"></div>
```
接下来,在JavaScript文件中编写`showCurrentDate`函数,该函数会在用户点击按钮时获取当前日期并将其显示在`<div>`元素中:
```javascript
function showCurrentDate() {
var dateElement = document.getElementById('dateDisplay');
var currentDate = new Date(); // 获取当前日期
dateElement.innerHTML = currentDate.toLocaleDateString(); // 将日期格式化并显示
}
```
当你点击"显示当前日期"按钮时,下面的`<div>`元素会更新并显示出当前的本地日期。
阅读全文