写一个HTML的日期样式,将选中的结果console.log输出
时间: 2024-02-21 20:58:01 浏览: 104
你可以使用 HTML 中的 `<input>` 元素和 `type="date"` 属性来创建日期选择器。当用户选择日期后,可以使用 Javascript 来获取选中的日期,并将其输出到控制台中。
HTML代码:
```
<label for="date">选择日期:</label>
<input type="date" id="date" onchange="logDate()"/>
```
在这个例子中,使用`<label>`元素来标记日期选择器,使用`<input>`元素来创建日期选择器,并设置`type="date"`属性。当用户选择日期后,会触发`onchange`事件,并调用`logDate()`函数。
Javascript代码:
```
function logDate() {
const dateInput = document.getElementById("date");
const selectedDate = dateInput.value;
console.log("Selected date: ", selectedDate);
}
```
在这个例子中,定义了一个名为`logDate()`的函数,用于获取选中的日期并将其输出到控制台中。在函数中,首先使用`document.getElementById()`方法获取日期选择器的值,然后使用`console.log()`方法将选中的日期输出到控制台中。
当用户选择日期后,会触发`onchange`事件,并调用`logDate()`函数。函数会获取选中的日期并将其输出到控制台中。
阅读全文