如何用JavaScript触发浏览器原生表单验证错误提示？

是否可以通过JavaScript触发浏览器原生的表单验证错误反馈？

当用户提交包含未填写必填输入项的表单时，现代浏览器会自动处理校验逻辑，并对存在错误的输入项展示对应错误提示，若checkValidity()方法返回false则展示对应表单错误。
不同浏览器的展示逻辑存在差异，以下是Edge浏览器当前的提示效果示例：

我希望不依赖submit事件就能实现同款原生校验反馈效果。HTMLSelectElement.checkValidity()方法可以获取表单校验是否通过的布尔值结果，开发者可以基于这个返回值自行编写代码实现视觉反馈，但如果有原生方法可以直接触发错误提示，就能大幅减少开发工作量。

我已经试过使用普通提交按钮搭配preventDefault阻止默认事件实现需求，功能可以正常运行，但我想找更直接的实现方式，逻辑上类似调用HTMLSelectElement.displayErrors()就能完成的方法。

你需要的原生API是HTMLFormElement.reportValidity()，调用该方法即可直接触发浏览器原生的表单校验错误提示，无需依赖表单提交事件，提示样式和用户点击提交按钮触发的原生提示完全一致。

内容的提问来源于stack exchange，提问作者Álvaro Franz