matches()不能直接校验必填，仅能通过input.matches('[required]')判断元素是否声明required属性；必填校验需结合required属性与value.trim()!==''，推荐用checkvalidity()进行完整验证。
JavaScript 中 matches() 本身不用于校验“必填”，它只是判断当前元素是否匹配某个 CSS 选择器。要校验输入框是否“必填”且有值，需结合 required 属性、元素值（value）和空值逻辑来判断，matches() 只起辅助作用（比如检查是否带 required 属性）。
先确认输入框是否标记为必填
用 matches('[required]') 可快速判断该 <input> 元素是否声明了 required 属性（无论浏览器是否支持或是否已填写）：
-
✅ 正确用法：
input.matches('[required]')→ 返回true表示 HTML 中写了required - ⚠️ 注意：这不等于“已填写”，只是说明“设计上要求必填”
再检查用户是否真的输入了有效内容
必填规则的核心是：有 required 属性 且 value.trim() !== ''。不能只靠 matches()：
Java Maven Common
下载
Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。
const isEmpty = input.value.trim() === '';const isRequired = input.matches('[required]');const isValid = !isRequired || !isEmpty; // required 时不能为空，非 required 时总为 true
完整校验函数示例
可封装一个简洁的校验函数：
function isRequiredValid(input) {
if (!input || !input.matches('input, textarea, select')) return true;
if (!input.matches('[required]')) return true;
return input.value?.trim() !== '';
}
// 使用
const el = document.querySelector('#username');
if (!isRequiredValid(el)) {
console.log('该必填项为空');
}
补充：配合表单原生验证更可靠
现代浏览器中，直接调用 checkValidity() 更稳妥，它已内置对 required、类型、模式等规则的综合判断：
-
input.checkValidity()→ 自动返回布尔值，含必填、格式、自定义setCustomValidity等 -
input.reportValidity()→ 显示默认浏览器提示（推荐用于提交前统一触发） -
matches()在这里仅适合做条件前置判断（如“只对 required 元素执行某逻辑”）
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
