訪問(wèn)兄弟節(jié)點(diǎn)的問(wèn)題
上面兩個(gè)截圖在while語(yǔ)句中的條件我已經(jīng)圈出來(lái)了,為什么兩個(gè)運(yùn)行的結(jié)果一個(gè)可以顯示“已經(jīng)是最后一個(gè)節(jié)點(diǎn)”,另一個(gè)卻沒(méi)有執(zhí)行到這一步
!DOCTYPE?HTML> <html> <head> <meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"> <title>nextSibling</title> </head> <body> <ul?id="u1">??? ????????????<li?id="a">javascript</li>??? ????????????<li?id="b">jquery</li>??? ????????????<li?id="c">html</li>??? ????????</ul>??? ????????<ul?id="u2">??? ????????????<li?id="d">css3</li>??? ????????????<li?id="e">php</li>??? ????????????<li?id="f">java</li>??? ????????</ul>??? <script?type="text/javascript"> ????function?get_nextSibling(n){ ????????var?x=n.nextSibling; ????????while?(x&&x.nodeType!=1){ ????????????alert(x.nextSibling); ????????} ????????return?x; ????} ????var?x=document.getElementsByTagName("li")[2]; ????document.write(x.nodeName); ????document.write("?=?"); ????document.write(x.innerHTML); ???? ????var?y=get_nextSibling(x); ???? ????if(y!=null){ ????????document.write("<br?/>nextsibling:?"); ????????document.write(y.nodeName); ????????document.write("?=?"); ????????document.write(y.innerHTML); ????}else{ ??????document.write("<br>已經(jīng)是最后一個(gè)節(jié)點(diǎn)");?????? ????} </script> </body> </html>
2016-04-11
22行的結(jié)果為null,?var?x=document.getElementsByTagName("li")[2];的下一個(gè)節(jié)點(diǎn)在火狐中是空白符屬于文本節(jié)點(diǎn),符合while條件,會(huì)進(jìn)入循環(huán),循環(huán)中x=x.nextSibling; 此時(shí)x.nextSibling已近為null,如果while中加上x(chóng) && ,判斷x為真才執(zhí)行,此時(shí)為null,所以不執(zhí)行,跳出循環(huán)執(zhí)行return x; 如果你while條件不判斷x是否為真,只有x.nodeType!=1的話,此時(shí)的while循環(huán)已經(jīng)出錯(cuò)了,因?yàn)閚ull沒(méi)有nodeType屬性,下面的return x ;都不執(zhí)行。var y=get_nextSibling(x);函數(shù)連返回值都沒(méi)有。什么都不輸出。
2016-04-11
最后一個(gè)li標(biāo)簽后面還有一個(gè)文本節(jié)點(diǎn),不是這個(gè)節(jié)點(diǎn)的內(nèi)容返回值是null,而是這個(gè)空白符沒(méi)有nextSibling屬性,因?yàn)橐呀?jīng)是最后一個(gè) li元素了。最后一個(gè)li元素之后的空白符沒(méi)有下一個(gè)子節(jié)點(diǎn),所以x.nextSibling得值為null,沒(méi)有nodeTyoe屬性。
我給你將這個(gè)while的過(guò)程走一遍,你應(yīng)該理解了while (x&&x.nodeType!=1)是不能省略x && 的。
還是按照你的代碼走,這里找的是最后一個(gè)li元素<li id="c">html</li>,也就是var x=document.getElementsByTagName("li")[2]; ?
接下來(lái)進(jìn)入循環(huán):
var y=get_nextSibling(x);//將最后一個(gè)li元素x作為參數(shù)傳入函數(shù)get_nextSibling()
function get_nextSibling(n){
??????? var x=n.nextSibling;//假設(shè)在火狐瀏覽器,這里的nextSibling為空白符,屬于文本節(jié)點(diǎn),nodeType=3
??????? while (x&&x.nodeType!=1){ //文本節(jié)點(diǎn)有nodeType屬性,所以while(x)為真,3!=1也成立,繼續(xù)執(zhí)行
??????????? x=x.nextSibling;//空白符之后沒(méi)有l(wèi)i元素了,所以x.nextSibling=null,將x=null繼續(xù)傳入while條件中作 判斷,其中while(x)就不滿足,null相當(dāng)于!x,所以不在執(zhí)行循環(huán)體中的代碼,x=null就是此次循環(huán)的結(jié)果。如果你這里while中只寫(xiě) while(x.nodeType!=1),就出錯(cuò)了,null沒(méi)有這個(gè)屬性。出錯(cuò)之后下面的rerun x將不在執(zhí)行。所以你頁(yè)面中什么都不輸出
??????? }
??????? return x;//相當(dāng)于return null,所以頁(yè)面會(huì)輸出 ‘已經(jīng)是最后一個(gè)節(jié)點(diǎn)’
??? }? ? ?
2016-04-11
回復(fù) 不知所語(yǔ):接下來(lái)進(jìn)入循環(huán):
var y=get_nextSibling(x);//將最后一個(gè)li元素x作為參數(shù)傳入函數(shù)get_nextSibling()
function get_nextSibling(n){
??????? var x=n.nextSibling;//假設(shè)在火狐瀏覽器,這里的nextSibling為空白符,屬于文本節(jié)點(diǎn),nodeType=3
??????? while (x&&x.nodeType!=1){ //文本節(jié)點(diǎn)有nodeType屬性,所以while(x)為真,3!=1也成立,繼續(xù)執(zhí)行
??????????? x=x.nextSibling;//空白符之后沒(méi)有l(wèi)i元素了,所以x.nextSibling=null,將x=null繼續(xù)傳入while條件中作判斷,其中while(x)就不滿足,null相當(dāng)于!x,所以不在執(zhí)行循環(huán)體中的代碼,x=null就是此次循環(huán)的結(jié)果。如果你這里while中只寫(xiě)while(x.nodeType!=1),就出錯(cuò)了,null沒(méi)有這個(gè)屬性。出錯(cuò)之后下面的rerun x將不在執(zhí)行。所以你頁(yè)面中什么都不輸出
??????? }
??????? return x;//相當(dāng)于return null,所以頁(yè)面會(huì)輸出 ‘已經(jīng)是最后一個(gè)節(jié)點(diǎn)’
??? }
2016-04-11
你上面說(shuō)的符合while條件,進(jìn)入循環(huán),此時(shí)循環(huán)中的x=x.nextSibling;已經(jīng)是null,那么這個(gè)時(shí)候應(yīng)該執(zhí)行的是返回x的值,即返回null 不就會(huì)輸出嗎
我知道你的意思是說(shuō)文本節(jié)點(diǎn)后是沒(méi)有節(jié)點(diǎn)的,但是現(xiàn)在不是在判斷最后一個(gè)li節(jié)點(diǎn)的兄弟節(jié)點(diǎn)嗎,