html5 的 `min` 和 `max` 属性仅对数值型或日期型输入（如 `type="number"`、`type="date"`）生效，无法用于文本长度限制；若需校验输入字符数，应使用 `pattern` 配合正则表达式，或改用 `type="number"` 并确保值可被解析为数字。
在您提供的代码中， 之所以未触发验证，根本原因在于：min/max 对 type="text" 无效。HTML5 规范明确规定，这两个属性仅适用于以下输入类型：
- number（校验数值大小，如 min="10" max="100"）
- range（同上）
- date / datetime-local / month / week（校验日期范围）
- time（校验时间范围）
而 type="text" 是纯字符串输入，浏览器会忽略其 min/max 属性——即使 DOM 中渲染正确，也不会触发任何约束验证（Constraint Validation API）。
✅ 正确方案一：用 pattern 实现固定长度校验（推荐）
若 custnum 是 5 位字符串（含前导零，如 "00123"），应使用正则匹配字符长度：
? pattern="^.{5}$" 表示：从头到尾恰好匹配 5 个任意字符（换行符除外）。title 属性会在验证失败时作为提示文案显示。
在 JavaScript 动态创建时，同步设置：
立即学习“前端免费学习笔记（深入）”；
if (input.name === "custnum") {
input.required = true;
input.pattern = "^.{5}$";
input.title = "Customer number must be exactly 5 characters long";
// 移除无效的 min/max
input.removeAttribute("min");
input.removeAttribute("max");
}✅ 正确方案二：改用 type="number" + min/max（仅适用于纯数字且无需前导零）
若业务允许 custnum 为无前导零的整数（如 123 而非 00123），可改为：
⚠️ 注意：type="number" 会自动过滤非数字输入，且不支持前导零（输入 "00123" 会被转为 123），因此不适用于需要保留格式的场景。
? 验证是否生效？简单测试方法
在控制台执行以下命令，检查约束状态：
const el = document.getElementById("custnum");
console.log(el.validity); // 查看 validity 状态对象
console.log(el.checkValidity()); // 手动触发校验，返回布尔值
console.log(el.validationMessage); // 获取当前错误提示? 关键注意事项总结
- ❌ 不要对 type="text" 使用 min/max —— 浏览器静默忽略，无警告；
- ✅ pattern 是校验文本长度/格式的 HTML5 原生方案，兼容性好（IE10+）；
- ✅ 动态添加表单字段时，务必通过 .setAttribute() 或直接赋值 .pattern 设置属性，避免遗漏；
- ✅ 结合 title 提供友好提示，提升用户体验；
- ✅ 服务端必须做二次校验（如 ASP.NET Core 模型绑定 [StringLength(5, MinimumLength = 5)]），切勿依赖前端验证。
通过以上调整，您的表单提交时将正确触发长度校验，并在用户输入不符合要求时阻止提交并显示提示，真正实现健壮的客户端约束验证。
