nextSibling

nextSibling

nextSibling 屬性可返回某個元素之後緊跟的元素(處於同一樹層級中)。如果無此節點,則屬性返回 null。

定義和用法

與其相反的是 previousSibling

語法:

nodeObject.nextSibling

提示和注釋

注釋:Internet Explorer 會忽略節點間生成的空白文本節點(例如,換行符號),而 Mozilla 不會這樣做。因此,在下面的例子中,我們會使用一個函式來檢查首個子節點的節點類型。

元素節點的節點類型是 1,因此如果首個子節點不是一個元素節點,它就會移至下一個節點,然後繼續檢查此節點是否為元素節點。整個過程會一直持續到首個元素子節點被找到為止。通過這個方法,我們就可以在 Internet Explorer 和 Mozilla 得到正確的方法。

實例

假設要取到所有頁面中所有H1標題後面的下一個元素為其添加CSS屬性.

var heads = document.getElementsByTagName("h1");

for(var i=0; i<heads.length; i++){

var elements = nextnode(heads[i].nextSibling); //設定nextnode函式,返回值

elements.style.color="red"; //為其添加樣式

}

function nextnode(node){

if(node.nodeType == 1){ //判斷是否是元素節點,排除空的文本節點

return node;

}

if(node.nextSibling){

return nextnode(node.nextSibling);

}

}

在所有的例子中,我們將使用 XML 檔案 books.xml,以及 JavaScript 函式 loadXMLDoc()。

下面的代碼片段可取得 XML 文檔中首個 <title> 元素的下一個同級子節點:

//check if the next sibling node is an element node

function get_nextsibling(n)

{ var x=n.nextSibling; while (x.nodeType!=1) { x=x.nextSibling; } return x; }

xmlDoc=loadXMLDoc("books.xml");

var x=xmlDoc.getElementsByTagName("title")[0];document.write(x.nodeName);

document.write(" = ");

document.write(x.childNodes[0].nodeValue);

var y=get_nextsibling(x);

document.write("<br />Next sibling: ");

document.write(y.nodeName);

document.write(" = ");

document.write(y.childNodes[0].nodeValue);

輸出:

title = Everyday Italian Next sibling: author = Giada De Laurentiis

相關搜尋

熱門詞條

聯絡我們