JavaScript prossimo fratello?

Question

Qualcuno potrebbe mostrarmi come scorrere i tag di ancoraggio all'interno di un div e trovare il fratello successivo?

Finora ci sono riuscito.

var menu = document.getElementById('menu'); 
var links = menu.getElementsByTagName('a'); 

Come si esegue il loop dei collegamenti? Posso usare .nextSibling per scoprire se il fratello successivo è un div?

Answer 1

La nextSibling proprietà di nodi DOM funziona perfettamente in tutti i browser e fa esattamente quello che ci si aspetterebbe. Se non ci sono fratelli successivi, restituisce null.

Iterating over a NodeList (che è cosa restituisce getElementsByTagName) è identico a iterare su un array utilizzando un ciclo standard for. Quanto segue iterare i link e avvisare ogni volta che trova uno il cui fratello successivo è un <div>:

var menu = document.getElementById('menu'); 
var links = menu.getElementsByTagName('a'); 

// Iterate over the links 
for (var i = 0, len = links.length, link; i < len; ++i) { 
    link = links[i]; 
    if (link.nextSibling && link.nextSibling.nodeName == "DIV") { 
     alert("Next sibling is DIV! " + link.innerHTML); 
    } 
} 

Si noti che in non-IE browser, gli spazi bianchi tra gli elementi in HTML è considerato un nodo di testo. Potresti voler ignorare questi nodi di spazi bianchi quando consideri quale è il fratello successivo di ciascun collegamento. Di seguito lo farà:

function isWhitespace(node) { 
    return node.nodeType == 3 && /^\s*$/.test(node.data); 
} 

// Iterate over the links 
for (var i = 0, len = links.length, link, next; i < len; ++i) { 
    link = links[i]; 
    next = link.nextSibling; 
    if (next && isWhitespace(next)) { 
     next = next.nextSibling; 
    } 
    if (next && next.nodeName == "DIV") { 
     alert("Next sibling is DIV! " + link.innerHTML); 
    } 
} 

Answer 2

for(var i=0; i<links.length; i++) {  
if (links[i].nextChild.nodeName=="DIV") 
    alert("This is a DIV") 
}