方法
<input>元素在HTML5中增加了2个与校验相关的方法：
checkValidity() ：判断控件的内容是否校验通过。
setCustomValidity() ：设置校验不通过时的自定义信息。
boolean checkValidity() ：判断控件的内容是否校验通过
返回值：
{boolean} 返回一个boolean值表示控件内容是否校验通过。
示例：
HTML：
网址：<input type="url" id="webURL" />JavaScript：
// 内容为：www.cnblogs.com/polk6
console.log(document.getElementById('webURL').checkValidity()); // => false ：验证不通过// 内容为：http://www.cnblogs.com/polk6
console.log(document.getElementById('webURL').checkValidity()); // => true ：验证通过
void setCustomValidity(string msg) ：设置校验不通过时的自定义信息
说明：在此元素上弹出一个警告框，显示自定义信息。
注意：只有表单验证时才会显示自定义的警告信息。
参数：
msg {string} ：设置需要显示的信息。若为空值，将关闭警告框。
示例：
HTML：
<form>
<p>新的密码：<input type="password" id="newPwd" oninput="validityPwd()" required /></p>
<p>确认密码：<input type="password" id="newPwdConfirm" oninput="validityPwd()" /></p>
<input type="submit" />
</form>
JavaScript：
// 校验2个密码是否一致
var validityPwd = function(){
var newPwd = document.getElementById('newPwd');
var newPwdConfirm = document.getElementById('newPwdConfirm');
if(newPwd.value != newPwdConfirm.value){
newPwdConfirm.setCustomValidity('两次密码输入不一致');
}else{
newPwdConfirm.setCustomValidity('');
}
}
新的控件
<input>元素的type属性的值，决定了<input>元素显示什么控件。
HTML5中，给<input>增加了许多新的控件，如color、date、email、month、number、range、search、tel、time、url、week等等。
若浏览器不支持新的控件，将默认以文本框展示(type="text")。
简单介绍
<input>元素type属性的值：
color ：颜色控件。<>
date ：日期控件。<>
email ：电子邮件地址输入框。<>
month ：年月日历控件。<>
