html中不存在max-length属性，正确写法是maxlength（全小写、无连字符），仅对text、password、textarea有效，限制unicode字符数，需后端校验且不能替代js语义化控制。
HTML里没有max-length属性
HTML原生表单控件（比如 <input> 或 <textarea></textarea>）根本不存在叫 max-length 的属性——这是个常见拼写混淆。真正起作用的是 maxlength，全小写、无连字符。
- 写成
max-length或maxLength都会被浏览器忽略，不报错也不生效 -
maxlength只对<input type="text">、<input type="password">、<textarea></textarea>有效，对<input type="number">无效 - 它限制的是字符数（不是字节数），中文、英文、emoji 都算 1 个字符
maxlength 在不同场景下的行为差异
这个属性看着简单，但实际表现和输入法、浏览器、甚至光标位置都有关联。
- 用户用中文输入法打字时，未上屏的拼音串不算入长度，确认上屏后才触发截断
- Safari 对
<textarea></textarea>的maxlength支持较晚（iOS 12.2+ 才稳定），旧版本可能完全不响应 - 粘贴超长内容时，Chrome/Firefox 会自动截掉超出部分；Edge（旧版）可能允许粘贴但后续无法继续输入
- JS 动态设置
element.maxLength = 10是有效的，但设为-1或null不会取消限制，得设为undefined或移除属性
为什么只靠 maxlength 不够用
它只能拦住 DOM 层面的输入，绕过方式太多：禁用 JS 后粘贴、用 DevTools 修改属性、发请求绕过前端校验。
- 后端必须做等价长度校验，且注意：UTF-8 下一个 emoji 可能占 4 字节，而
maxlength数的是 Unicode 码点 - 如果业务要求“最多 10 个汉字”，但用户混输中英文，单纯
maxlength="10"无法区分语义，得用 JS + 正则或 Intl.Segmenter 做更细粒度控制 - 辅助技术（如屏幕阅读器）对
maxlength的播报支持不一致，最好配合aria-describedby提示剩余字数
想动态控制长度？别直接改 maxlength
直接操作 maxlength 属性容易引发输入中断或光标跳变，尤其在受控组件里。
立即学习“前端免费学习笔记（深入）”；
- React/Vue 中优先通过状态控制值（
value），再在onChange里截断字符串，比改maxlength更可靠 - 若必须用
maxlength切换，记得同步调用element.setSelectionRange()修复光标位置，否则 iOS 上光标可能卡在末尾 - 测试时重点看组合键：Ctrl+V、Shift+Insert、右键粘贴、拖拽文本进来，这些路径不一定触发 same-input 事件流
maxlength 是第一道轻量防线，但它既不是长度定义的源头，也不是最终保障。字符计数逻辑一旦涉及业务规则，就得从 JS 层统一收口，HTML 属性只是个快捷同步开关。 
