min/max 必须为严格 YYYY-MM-DD 格式字符串，动态设置需用 setAttribute 或触发 input 事件，联动时需同步清除属性，且手动输入不受限制，必须配合实时校验与后端验证。
min 和 max 必须是严格 YYYY-MM-DD 字符串
浏览器只认形如 "2026-08-11" 的字符串，错一位就失效。常见错误包括：
• 用 new Date().toISOString() 直接赋值 → 得到 "2026-08-11T08:26:30.123Z"，必须截断：.slice(0, 10)
• 手拼 "2026-8-11" 或 "2026/08/11" → 属性被静默忽略，日历照常可点
• 后端返回 "2026-08-11 00:00:00" 或带时区格式 → 浏览器不解析，checkValidity() 返回 false
动态设置要用 setAttribute 或触发重绘
直接写 input.min = "2026-08-11" 在 Safari（尤其 iOS ≤ 15.5）和旧版 Chrome 中 UI 不更新，用户仍能点选超限日期。
可靠做法只有两种：
• input.setAttribute('min', '2026-08-11') —— 强制 DOM 属性变更，触发重绘
• input.min = '2026-08-11'; input.dispatchEvent(new Event('input', { bubbles: true }))
另外，如果 input.value 已超出新 max，浏览器不会自动清空，需显式判断：if (input.value && input.value > input.max) input.value = ''
联动日期时 min/max 清空逻辑不能漏
做“结束日期 ≥ 开始日期”这类联动时，仅设 end.min = start.value 不够。
一旦用户清空 start，end.min 若未同步清除，end 就永远无法选任何值。
必须：
• 监听 start 的 change 事件：若 start.value === ''，执行 end.removeAttribute('min')
• 移动端 Safari 的 change 触发不稳定，建议额外监听 blur 做兜底
• 校验失败时调用 end.setCustomValidity('结束日期不能早于开始日期') 并立即 end.reportValidity()
使用 Puppeteer + Chrome 将 HTML 渲染为中文 PDF，自动处理图表等待、Tab 展开、动画、测高、白边消除、防分页，适用于看板、报表、网页和交互图表转 PDF。
手动输入永远绕过 min/max 限制
min 和 max 只约束日历控件和滚动选择，对键盘输入、粘贴、删除重输完全无效。
用户可以轻松输入 "2025-01-01" 到一个 max="2024-12-31" 的框里。
所以：
• 必须监听 input 事件实时校验：if (input.value && new Date(input.value) > new Date(input.max)) {...}
• 永远不能省略后端校验——前端限制只是体验层，不是安全边界
• 时区容易踩坑：设 max="2026-08-11" 是按用户本地时区解释的，若后端存 UTC 时间，需先转成本地日期再设，否则可能少算一天
立即学习“前端免费学习笔记（深入）”；
