应使用 valueAsDate 获取 Date 对象再调用 getDay()（返回 0–6，0 为周日），需先判空防 TypeError；监听 input 事件实时响应，注意清空时 valueAsDate 为 null；兼容性佳，但 Safari 旧版需 fallback 字符串解析。
用 valueAsDate 获取日期对象再调用 getDay()
HTML 的 <input type="date"> 本身不直接暴露星期几，但它的 valueAsDate 属性会返回一个标准 Date 对象，这是最可靠、无需字符串解析的途径。
注意：必须确保用户已选值（value 非空），否则 valueAsDate 返回 null，直接调用 getDay() 会报 TypeError: Cannot read property 'getDay' of null。
-
getDay()返回 0–6，其中 0 表示周日，1 是周一……6 是周六（不是 1–7） - 如果需要中文“周一”“周二”，建议用数组映射：
['周日', '周一', '周二', '周三', '周四', '周五', '周六'] - 不要用
value字符串手动拆分年月日再 new Date() —— 存在时区风险（比如"2024-05-20"在东八区可能被解释为 5 月 19 日晚上的时间）
监听 input 或 change 事件实时响应
用户选择日期后，应监听 input（即时触发，适合实时显示）或 change（失焦/确认后触发，更节省）事件来读取值。
常见错误是只监听 click 或 focus，这些和选值无关；也有人误以为 onselect 能捕获日期选择 —— 实际上该事件不适用于 type="date"。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
立即学习“前端免费学习笔记（深入）”；
-
input事件在每次选择变动时触发（包括清空），适合做实时反馈 -
change仅在用户确认选择（如点“确定”或失焦）后触发，更适合提交前校验 - 务必在事件回调里先检查
input.valueAsDate是否存在，再调用getDay()
兼容性与移动端注意事项
所有现代桌面/移动浏览器（Chrome、Firefox、Safari、Edge）都支持 valueAsDate，但 Safari 旧版本（≤14.1）对 input[type=date] 的原生控件支持较弱，部分 iOS 版本会降级为文本输入框 —— 此时 valueAsDate 返回 null，需 fallback 到手动解析 value 字符串（仅当确认无原生控件时才启用）。
- 不要依赖
input.type === 'date'就认定有原生支持；可用input.showPicker存在性粗略判断（但非标准） - 若需强一致性，推荐搭配
moment.js或date-fns解析字符串（如parse(input.value, 'yyyy-MM-dd', new Date())），但纯原生方案优先走valueAsDate - Android Chrome 和 iOS Safari 原生日期选择器返回的
value格式恒为YYYY-MM-DD（ISO 8601），可安全用于 fallback 解析
完整最小可行示例
以下代码可直接粘贴进 HTML 运行，无外部依赖：
<input type="date" id="datePicker">
<span id="weekDay"></span>
<script>
const input = document.getElementById('datePicker');
const display = document.getElementById('weekDay');
const weekdays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
input.addEventListener('input', () => {
if (input.valueAsDate) {
const dayIndex = input.valueAsDate.getDay();
display.textContent = weekdays[dayIndex];
} else {
display.textContent = '';
}
});
</script>
真正容易被忽略的是：用户手动清空输入框时，valueAsDate 变成 null，而很多人只处理了“有值”的分支，导致后续逻辑出错或界面残留旧星期。
