訪問兄弟節點的問題
上面兩個截圖在while語句中的條件我已經圈出來了，為什么兩個運行的結果一個可以顯示“已經是最后一個節點”，另一個卻沒有執行到這一步
!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>已經是最后一個節點");??????
????}
</script>
</body>
</html>
2016-04-11
22行的結果為null，?var?x=document.getElementsByTagName("li")[2];的下一個節點在火狐中是空白符屬于文本節點，符合while條件，會進入循環，循環中x=x.nextSibling; 此時x.nextSibling已近為null，如果while中加上x && ，判斷x為真才執行，此時為null，所以不執行，跳出循環執行return x; 如果你while條件不判斷x是否為真，只有x.nodeType!=1的話，此時的while循環已經出錯了，因為null沒有nodeType屬性，下面的return x ;都不執行。var y=get_nextSibling(x);函數連返回值都沒有。什么都不輸出。
2016-04-11
最后一個li標簽后面還有一個文本節點,不是這個節點的內容返回值是null，而是這個空白符沒有nextSibling屬性，因為已經是最后一個 li元素了。最后一個li元素之后的空白符沒有下一個子節點，所以x.nextSibling得值為null，沒有nodeTyoe屬性。
我給你將這個while的過程走一遍，你應該理解了while (x&&x.nodeType!=1)是不能省略x && 的。
還是按照你的代碼走，這里找的是最后一個li元素<li id="c">html</li>，也就是var x=document.getElementsByTagName("li")[2]; ?
接下來進入循環：
var y=get_nextSibling(x);//將最后一個li元素x作為參數傳入函數get_nextSibling()
function get_nextSibling(n){
??????? var x=n.nextSibling;//假設在火狐瀏覽器，這里的nextSibling為空白符，屬于文本節點，nodeType=3
??????? while (x&&x.nodeType!=1){ //文本節點有nodeType屬性，所以while(x)為真，3！=1也成立，繼續執行
??????????? x=x.nextSibling;//空白符之后沒有li元素了，所以x.nextSibling=null,將x=null繼續傳入while條件中作 判斷，其中while(x)就不滿足，null相當于!x,所以不在執行循環體中的代碼，x=null就是此次循環的結果。如果你這里while中只寫 while(x.nodeType!=1),就出錯了，null沒有這個屬性。出錯之后下面的rerun x將不在執行。所以你頁面中什么都不輸出
??????? }
??????? return x;//相當于return null，所以頁面會輸出 ‘已經是最后一個節點’
??? }? ? ?
2016-04-11
回復 不知所語：接下來進入循環：
var y=get_nextSibling(x);//將最后一個li元素x作為參數傳入函數get_nextSibling()
function get_nextSibling(n){
??????? var x=n.nextSibling;//假設在火狐瀏覽器，這里的nextSibling為空白符，屬于文本節點，nodeType=3
??????? while (x&&x.nodeType!=1){ //文本節點有nodeType屬性，所以while(x)為真，3！=1也成立，繼續執行
??????????? x=x.nextSibling;//空白符之后沒有li元素了，所以x.nextSibling=null,將x=null繼續傳入while條件中作判斷，其中while(x)就不滿足，null相當于!x,所以不在執行循環體中的代碼，x=null就是此次循環的結果。如果你這里while中只寫while(x.nodeType!=1),就出錯了，null沒有這個屬性。出錯之后下面的rerun x將不在執行。所以你頁面中什么都不輸出
??????? }
??????? return x;//相當于return null，所以頁面會輸出 ‘已經是最后一個節點’
??? }
2016-04-11
你上面說的符合while條件，進入循環，此時循環中的x=x.nextSibling;已經是null，那么這個時候應該執行的是返回x的值，即返回null 不就會輸出嗎
我知道你的意思是說文本節點后是沒有節點的，但是現在不是在判斷最后一個li節點的兄弟節點嗎，