表单验证是一套系统，它为终端用户检测无效的数据并标记这些错误，是一种用户体验的优化，让web应用更快的抛出错误，但它仍不能取代服务器端的验证，重要数据还要要依赖于服务器端的验证，因为前端验证是可以绕过的。
html5验证的几种类型：
1、valueMissing
目的：确保表单控件中的值已填写。
用法：在表单控件中将required特性设置为true。
示例：
<input type="text" required>详细说明：如果表单控件设置了required特性，那么在用户填写或者通过代码调用方式填值之前，控件会一直处于无效状态。例如，空的文本输入框无法通过必填检查，除非在其中输入任意文本。输入值为空时，valueMissing会返回true。
2、typeMismatch
目的：保证控件值与预期类型相匹配(如numbe、email、URL等).
用法：指定表单控件的type特性值。
示例：
<input type="email">详细说明：特殊的表单控件类型不只是用来定制手机键盘， 如果浏览器能够识别出来表单控件中的输入不符合对应的类型规则，比如email地址中没有@符号，或者number型控件的输入值不是有效的数字，那么浏览器就会把这个控件标记出来以提示类型不匹配。无论哪种出错情况，typeMismatch将返回true。
3、patternMismatch
目的：根据表单控件上设置的格式规则验证输入是否为有效格式。
用法：在表单控件上设置pattern特性，井赋予适当的匹配规则。
示例：
<input type="text" pattern="[0-9]{16}" title="A credit card number is 16 digits with no spaces or dashes">详细说明：pattern特性向开发人员提供了一种强大而灵活的方式来为表单的控件值设定正则表达式验证机制。当为控件设置了pattern特性 后，只要输入控件的值不符合模式规则，patternMismatch就会返回true值。从引导用户和技术参考两方面考虑，你应该在包含pattern特性的表 单控件中设置title特性以说明规则的作用。
4、tooLong
目的：避免输入值包含过多字符。
用法：在表单控件上设置maxLength特性。
示例：
<input type="text" maxLength="140">详细说明：如果输入值的长度超过maxLength， tooLong特性会返回true。虽然表单控件通常会在用户输入时，限制最大长度，但在有些情况下，如通过程序设置，还是会超出最大值。
5、rangeUnderflow
目的：限制数值型控件的最小值。
用法：为表单控件设置min特性，并赋予允许的最小值。
示例：
<input type="range" min="18">详细说明：在需要做数值范围检查的表单控件中，数值很可能会暂时低于设置的下限。此时，ValidityState的rangeUnderflow特性将返回true。
6、rangeOverflow
目的：限制数值型控件的最大值。
用法：为表单控件设置max特性，并赋予允许的最大值。
示例：
<input type="range" max="12">详细说明：与rangeUnderflow类似，如果一个表单控件的值比max更大，特性将返回true。
7、stepMismatch
目的：确保输入值符合min、max及step即设置。
用法：为表单控件设置step特性，指定数值的增量。
示例：
<input type="range" min="0" max="100" step="5">