请帮助我选择电子邮件验证的最佳解决方案，我找到了3个选项：
1、带花纹
<input type="email" id="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2, 4}$">
2、类型="文本"和电子邮件标签
<input type="text" id="email" email>
3、类型="电子邮件"和电子邮件标签
<input type="email" id="email">
谢谢
古代浏览器(IE9 及更早版本(不支持type="email"属性，但如今，这可能不是一个问题，因为许多网站正在放弃对 IE11 的支持。
正如MDN所说：
支持电子邮件输入类型的浏览器会自动提供验证，以确保输入框中仅输入与 Internet 电子邮件地址标准格式匹配的文本。实现该规范的浏览器应使用等效于以下正则表达式的算法：
/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
这不是一个完全微不足道的模式。此外，您当前的模式{2, 4}将仅匹配 2 到 4 个字符的 TLD，但有些 TLD 会有更多。
电子邮件属性(例如，<input type="text" id="email" email>中>之前的email(看起来没有任何用途。
如果您不打算支持过时的浏览器，那么最简单的方法是使用type="email"并让浏览器符合规范，而不是尝试自己重新实现某些(可能不符合规范(版本。
<input type="email">
请记住，这只是前端验证，但客户端可以在前端运行他们想要的任何代码 - 如果你想确保你的服务器处理的电子邮件是有效的，请确保在后端也验证它。
在我看来，regEXP(第一种方法(id是最好的。 它类似于第三个，但有一个好处：
您可以自定义自定义和自己的自定义样式验证消息，它有助于您的网站/应用程序看起来更美观和用户友好
该模式当然是最完整的，其他模式仅检查输入中是否有一个"@">