checkValidity(): 如果 input 元素中的数据是合法的返回 true，否则返回 false。 用法:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p>输入数字并点击验证按钮:</p> <input id="id1" type="number" min="100" max="300" required> <button onclick="myFunction()">验证</button> <p>如果输入的数字小于 100 或大于300，会提示错误信息。</p> <p id="demo"></p> <script> function myFunction() { var inpObj = document.getElementById("id1"); if (inpObj.checkValidity() == false) { document.getElementById("demo").innerHTML = inpObj.validationMessage; } else { document.getElementById("demo").innerHTML = "输入正确"; } } </script> </body> </html>setCustomValidity(): 设置 input 元素的 validationMessage 属性，用于自定义错误提示信息的方法。 使用 setCustomValidity 设置了自定义提示后，validity.customError 就会变成true，则 checkValidity 总是会返回false。 用法：
<body> <input type="text" id="input" required /> <button type="submit" onclick="myFunction()">提交</button> <p id="demo"></p> <script> function myFunction(){ var x=document.getElementById("input"); if(x.checkValidity()==false){x.setCustomValidity("输入错误，请重新输入！")} document.getElementById("demo").innerHTML=x.validationMessage; } </script> </body>取消自定义提示，方式如下：
setCustomValidity('') setCustomValidity(null) setCustomValidity(undefined)validity： 布尔属性值，返回 input 输入值是否合法 Validity 属性： rangeOverflow：设置为 true, 如果元素的值大于设置的最大值。 rangeUnderflow：设置为 true, 如果元素的值小于它的最小值。 用法:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p>输入数字并点击验证按钮:</p> <input id="id1" type="number" max="100"> <button onclick="myFunction()">验证</button> <p>如果输入的数字大于 100 ( input 的 max 属性), 会显示错误信息。</p> <p id="demo"></p> <script> function myFunction() { var txt = ""; if (document.getElementById("id1").validity.rangeOverflow) { txt = "输入的值太大了"; } else { txt = "输入正确"; } document.getElementById("demo").innerHTML = txt; } </script> </body> </html>注意: document.getElementById(“id1”).validity.rangeOverflow意思是：如果输入的数字大于设置的最大值，validity.rangeOverflow就为true。
Validity属性需补充
