js表单验证处理和childNodes 和children 的区别
一、對提交表單進(jìn)行空值驗證
html代碼：
1 <form action="#"onsubmit="return validate_form(this);" method="post"> 2 Email: <input type="text" name="emails" size="30"><br> 3 Phone: <input type="text" name="phone" size="30"><br> 4 <input type="submit" value="Submit"> 5 </form>?js:
1 function validate_required(field,alerttxt){ 2 with (field){ 3 /*如果輸入框值為空則返回false*/ 4 if (value==null||value==""){ 5 alert(name+alerttxt); 6 return false 7 }else { 8 return true 9 } 10 } 11 } 12 13 /*表單驗證*/ 14 function validate_form(thisform){ 15 with(thisform){ 16 for(i=0; i< elements.length-1; i++){ 17 /*遍歷表單內(nèi)容*/ 18 if (validate_required(elements[i]," must be filled out!")==false){ 19 elements[i].focus();//高亮空白輸入框 20 return false 21 } 22 } 23 } 24 return true; 25 }?二、childNodes 和children 的區(qū)別
1、childNodes：它是標(biāo)準(zhǔn)屬性，它返回指定元素的子節(jié)點集合，包括HTML節(jié)點，所有屬性和文本節(jié)點（包括換行和空格也算一個節(jié)點）。
-
- nodeType == 1時，表示該節(jié)點為元素節(jié)點，
- nodeType == 2時，表示該節(jié)點為屬性節(jié)點，
- nodeType == 3時，表示該節(jié)點為文本節(jié)點，
例如下面一段html代碼的head標(biāo)簽節(jié)點：
1 <head> 2 <meta charset="utf-8"> 3 <script type="text/javascript" src="G:/DevelopSoftware/Sublime/workspace/js/js/jquery.js"/></script> 4 <title>js測試</title> 5 </head>?
我想通過獲取子節(jié)點的方式來獲得頁面的title內(nèi)容并修改它，使用如下js方法
1 var h = document.getElementsByTagName("head")[0].childNodes;//獲取head標(biāo)簽的子節(jié)點集合 2 for(i=0 ; i<h.length; i++){ 3 /* 分別打印節(jié)點標(biāo)簽名、節(jié)點類型代碼、節(jié)點html代碼*/ 4 console.log(h[i].tagName+" | "+h[i].nodeType+" | "+h[i].outerHTML) 5 if(h[i].tagName == "TITLE"){ //tagNmae匹配的內(nèi)容都是大寫的 6 h[i].innerHTML = "改名了" 7 } 8 }運(yùn)行結(jié)果如下：
左邊是html源碼結(jié)構(gòu)，右邊是運(yùn)行結(jié)果，第一個節(jié)點現(xiàn)實的 節(jié)點類型代碼為3，表示他是一個文本節(jié)點（其實就是一個換行），第二個節(jié)點的類型代碼為1，表示他是一個html標(biāo)簽節(jié)點，（圖中紅色箭頭表示文本節(jié)點，黃色箭頭表示html標(biāo)簽節(jié)點）
當(dāng)我們將html代碼變成如下樣子（把所有節(jié)點寫在一行，html節(jié)點間不存在空格和換行），之后，再看運(yùn)行結(jié)果：
運(yùn)行結(jié)果：
發(fā)現(xiàn)節(jié)點只剩下三個了，剛好是三個HTML標(biāo)簽節(jié)點，所以可以看出childnodes查找節(jié)點是比較嚴(yán)格的，把空格和換行都算在節(jié)點中，它把整個源碼結(jié)構(gòu)都遍歷了。
2. children：它時非標(biāo)準(zhǔn)屬性，它只返回指定元素的子節(jié)點的HTML節(jié)點集合。
還是上面的例子的第一種情況，我們將獲取節(jié)點集合的方式改成chrildren，其他不變，看運(yùn)行結(jié)果：
可以發(fā)現(xiàn)結(jié)果它只保存了HTML節(jié)點，而沒有其余的文本節(jié)點干擾。
?
?
==========
轉(zhuǎn)載于:https://www.cnblogs.com/caijh/p/7784530.html
總結(jié)
以上是生活随笔為你收集整理的js表单验证处理和childNodes 和children 的区别的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 如何快速入手一个JavaWeb项目
- 下一篇： mdp文件-Chapter4-MD.md