Может ли кто-нибудь показать мне, как перебирать метки привязки в div и находить следующего брата?
У меня это до сих пор.
var menu = document.getElementById('menu');
var links = menu.getElementsByTagName('a');
Как мне перебирать ссылки? Могу ли я использовать .nextSibling, чтобы узнать, является ли следующий родной брат div?
Свойство nextSibling узлов DOM отлично работает во всех браузерах и делает именно то, что вы ожидаете. Если следующего брата нет, он возвращает null.
Итерация по NodeList (что возвращает getElementsByTagName), идентична итерации по массиву с использованием стандартного цикла for. Следующее будет перебирать ссылки и предупреждать каждый раз, когда он найдет тот, чей следующий брат - <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);
}
}
Обратите внимание, что в браузерах, отличных от IE, пробелы между элементами в HTML считаются текстом node. Вы можете игнорировать эти пробельные узлы при рассмотрении того, что следующий брат каждой ссылки. Следующее сделает следующее:
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);
}
}
for(var i=0; i<links.length; i++) {
if (links[i].nextChild.nodeName=="DIV")
alert("This is a DIV")
}