value === "" 不能判断“只输空格”，因空格字符串长度不为0；应使用 value.trim() === "" 判断，再配合正则清理零宽字符，并在 blur 或 submit 时统一校验 required 字段。
为什么 value === "" 不能判断用户是否“只输空格”
因为 value 是字符串，输入纯空格（如" "、" "、"\u200B"）时，它长度不为 0，=== "" 返回 false，但语义上这仍是无效输入。浏览器原生 required 也不拦——Chrome 对 type="text" 的 required 只看 value.length > 0，不自动 trim()。
用 value.trim() === "" 是最简可靠方案
这是前端校验空格类无效输入的黄金标准，覆盖常见干扰：
-
" "（全角/半角空格、制表符、换行符）→trim()后为空字符串 -
"\u200Btest"（零宽空格开头）→trim()不处理，需额外正则清理 -
"abc "（尾部空格）→trim()后为"abc"，视为有效
注意：必须在调用 checkValidity() 前执行，否则 type="email" 等字段可能因尾部空格校验失败。
怎么发现并清理不可见字符（比如零宽空格）
用户粘贴内容常带 \u200B、\uFEFF、\u2060 等 Unicode 控制符，trim() 完全无效。可加一层轻量过滤：
立即学习“前端免费学习笔记（深入）”；
- 用正则
/[\u200B-\u200F\u202A-\u202E\u2060-\u2064\u2066-\u2069\uFEFF]/g匹配并replace()掉 - 或更保守地只对
input[type="text"]和textarea在blur时执行：el.value = el.value.replace(/[\u200B-\u200F\u202A-\u202E\u2060-\u2064\u2066-\u2069\uFEFF]/g, "") - 别在
input事件里高频替换，会破坏光标位置；blur或submit前做一次就够了
提交前统一校验所有必填字段是否“真非空”
不要逐个写 if (name.value.trim() && email.value.trim())，容易漏掉 trim() 或类型判断。推荐用 Constraint Validation API 批量处理：
- 获取全部
required字段：Array.from(form.querySelectorAll('[required]')) - 统一检查：
.every(el => el.checkValidity() && el.value.trim() !== '') - 对
type="email"字段，checkValidity()已含基础格式校验，比手写正则更兼容浏览器行为 - 如果某字段是
type="number"，checkValidity()会自动忽略首尾空格，但value.trim() !== ''仍需保留，以防用户输" "后未触发校验
真正难缠的不是空格本身，而是它和不可见字符、自动填充、移动端软键盘输入的组合行为——这些场景下，仅靠一次 trim() 不够，得在关键节点（blur / submit）做清洗 + 校验双动作。
