JavaScript約束驗(yàn)證DOM屬性實(shí)例分析

這篇“JavaScript約束驗(yàn)證DOM屬性實(shí)例分析”文章的知識(shí)點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價(jià)值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來看看這篇“JavaScript約束驗(yàn)證DOM屬性實(shí)例分析”文章吧。

　　約束驗(yàn)證 DOM 屬性

　　validity：布爾屬性值，返回 input 輸入值是否合法

　　validationMessage：瀏覽器錯(cuò)誤提示信息

　　willValidate：指定 input 是否需要驗(yàn)證

　　Validity 屬性

　　input 元素的 validity 屬性包含一系列關(guān)于 validity 數(shù)據(jù)屬性:

　　customError：設(shè)置為 true, 如果設(shè)置了自定義的 validity 信息。

　　patternMismatch：設(shè)置為 true, 如果元素的值不匹配它的模式屬性。

　　rangeOverflow：設(shè)置為 true, 如果元素的值大于設(shè)置的最大值。

　　rangeUnderflow：設(shè)置為 true, 如果元素的值小于它的最小值。

　　stepMismatch：設(shè)置為 true, 如果元素的值不是按照規(guī)定的 step 屬性設(shè)置。

　　tooLong：設(shè)置為 true, 如果元素的值超過了 maxLength 屬性設(shè)置的長(zhǎng)度。

　　typeMismatch：設(shè)置為 true, 如果元素的值不是預(yù)期相匹配的類型。

　　valueMissing：設(shè)置為 true，如果元素 (required 屬性) 沒有值。

　　valid：設(shè)置為 true，如果元素的值是合法的。

　　實(shí)例

　　如果輸入的值大于 100，顯示一個(gè)信息：

　　rangeOverflow 屬性

　　<input id="id1" type="number" max="100">

　　<button onclick="myFunction()">驗(yàn)證</button>

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

　　<script>

　　function myFunction() {

　　var txt = "";

　　if (document.getElementById("id1").validity.rangeOverflow) {

　　txt = "輸入的值太大了";

　　}

　　document.getElementById("demo").innerHTML = txt;

　　}

　　</script>

以上就是關(guān)于“JavaScript約束驗(yàn)證DOM屬性實(shí)例分析”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對(duì)大家有幫助，若想了解更多相關(guān)的知識(shí)內(nèi)容，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。