學習筆記本：getNextElement與nextSibling的疑惑

 

function getNextElement(node)
{
    if(node.nodeType == 1)
    {
        return node;
    }
    if(node.nextSibling)
    {
        return getNextElement(node.nextSibling);
    }
    return null;
}

 

 

下面是各個語句的解釋：

function getNextElement(node)//聲明getNextElement函數，參數為node節點
{
	if(node.nodeType == 1)
	{
		return node;//如果node節點類型值與1相等為真，即node節點為元素節點，則退出此函數，並此函數取值為node。
	}//如果node節點類型值與1相等為假，則繼續執行下面語句。
	if(node.nextSibling)//如果node節點的下一個兄弟節點存在即條件為真，則退出此函數，並遞歸，參數變為node節點的下一個兄弟節點。
	{
		return getNextElement(node.nextSibling);//從一個函數的內部調用這個函數本身叫作遞歸調用。
	}//如果node節點的下一個兄弟節點不存在即條件為假，則繼續執行下面語句。
	return null;//退出此函數，並此函數取值為null。
}

　　

 nextSibling是獲取當前節點的下一個節點。

在看javascript DOM編程藝術第九課的時候，對獲取當前元素的下一個元素節點有點疑惑，也就是getNextElement函數。

網上搜了一下，看到上面那段話的解釋 ，在看var elem = getNextElement(headers[i].nextSibling);的時候，就豁然開朗了。。

這個函數第一個檢測，headers[i]的下一個節點（nextSibling），如果是上元素節點就返回這個，並結束函數，由於html中有空格或者換行符，不一定就是元素節點。

否則，繼續下一個if語句，如果headers[i].nextSibling不是元素節點，那就下一個節點的下一個節點。headers[i].nextSibling.nextSibling。。。

就是這個意思，哈哈，哦也也，哦啦啦。。。