如何约束验证DOM

本文小编为大家详细介绍“如何约束验证DOM”，内容详细，步骤清晰，细节处理妥当，希望这篇“如何约束验证DOM”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。

　　约束验证 DOM 方法

　　checkValidity()：如果 input 元素中的数据是合法的返回 true，否则返回 false。

　　setCustomValidity()

　　设置 input 元素的 validationMessage 属性，用于自定义错误提示信息的方法。

　　使用 setCustomValidity 设置了自定义提示后，validity.customError 就会变成true，则 checkValidity 总是会返回false。如果要重新判断需要取消自定义提示，方式如下：

　　setCustomValidity('')

　　setCustomValidity(null)

　　setCustomValidity(undefined)

　　以下实例如果输入信息不合法，则返回错误信息：

　　checkValidity() 方法

　　<input id="id1" type="number" min="100" max="300" required>

　　<button onclick="myFunction()">验证</button>

　　<p id="demo"></p>

　　<script>

　　function myFunction() {

　　var inpObj = document.getElementById("id1");

　　if (inpObj.checkValidity() == false) {

　　document.getElementById("demo").innerHTML = inpObj.validationMessage;

　　}

　　}

　　</script>

读到这里，这篇“如何约束验证DOM”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注亿速云行业资讯频道。