minlength仅对text、email、password、search、tel、url、textarea和textarea有效，且必须与required配合才能触发tooShort校验；对number、date等类型无效，前端校验仅为体验优化，后端必须严格复核。
minlength 不是“一写就生效”的长度开关，它只在特定条件下参与原生校验，且对 number、date 等类型完全无效。
哪些 type 支持 minlength？一眼识别有效范围
浏览器只对语义明确的文本类输入启用该属性：
- ✅ 有效：
text、email、password、search、tel、url、textarea - ❌ 无效：
number、date、datetime-local、month、week、hidden、checkbox、file
给 type="number" 加 minlength="6" 是白写的——DOM 中属性存在，但浏览器既不报错也不校验。因为 minlength 检查的是字符串 UTF-16 长度，而 number 输入框的 value 可能是空字符串或 NaN，根本进不了长度判断逻辑。
minlength 必须搭配 required 才触发 tooShort 错误
单独写 minlength="5"，用户输 2 个字符后点提交，浏览器不会提示“太短”，而是优先报 valueMissing（空值错误）。这是因为 Constraint Validation API 的错误优先级固定为：valueMissing > tooShort > typeMismatch。
- ✅ 正确写法：
<input type="text" minlength="5" required> - ❌ 无效写法：
<input type="text" minlength="5">（留空或输少于 5 字都无tooShort提示） - ⚠️ 可选字段需最小长度？只能用 JS：
el.value.length 判断后调用 <code>setCustomValidity()
原生 minlength 只在提交时检查，实时截断得靠 JS
minlength 不拦截粘贴、不阻止键盘输入、不自动删超长内容。用户可以粘贴 200 字再点提交，此时才弹提示。想做到“输第 5 个字就停”，必须监听 input 事件：
const el = document.getElementById('limited');
el.addEventListener('input', () => {
if (el.value.length > 5) {
el.value = el.value.slice(0, 5);
}
});
注意点：
- 用
input而非keydown：前者覆盖粘贴、拖拽、语音输入等所有修改方式 - 中文输入法下注意
event.isComposing，避免打断拼音组合；建议同时监听compositionend - 动态改
value后，记得手动触发input或change事件，否则checkValidity()返回结果滞后
后端必须重复校验，且不能依赖 string.length
前端所有限制都可被绕过：curl 提交、DevTools 修改 DOM、禁用 JS —— 都能让超短值抵达后端。
- Node.js 应用
Buffer.byteLength(str, 'utf8')替代str.length，避免 emoji 或代理对（如 ??）计数错误 - PHP 用
mb_strlen($str, 'UTF-8')，Python 用len(text)（Python 3 默认按 Unicode 字符计数），但需确认是否含换行符（\n算 1 个，\r\n算 2 个） - 若业务要求“严格按视觉字符（grapheme cluster）计数”，需用
Intl.Segmenter或第三方库，不能只信.length
最常被忽略的是：前端校验只是体验层防护，后端才是唯一可信边界；而长度的“单位”在前后端必须对齐，否则 emoji 或 CJK 文本会悄悄越界。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
