Свойство nextSibling в HTML DOM

Объект элемента HTML DOM

nextSiblingЭта свойство возвращает следующий узел после элемента (включая текстовые узлы, комментарии, переводы строк, пробелы и т.д.).

Если нет следующего同级, то эта свойство возвращаетnull.

Пробелы считаются текстом, текст считается узлом. Комментарии также считаются узлами.

Чтобы избежать проблемы с возвращением #text или #comment узлами, можно использоватьnextElementSiblingВозвращает только узлы элементов.

ИспользованиеpreviousSiblingЭта свойство может возвращать предыдущий узел в том же уровне дерева.

ИспользованиеchildNodesЭта свойство может возвращать любую подузел指定的 узла.

Синтаксис:

node.nextSibling

<div　id="div-1">Здесь　есть　div-1</div>
<div　id="div-2">Здесь　есть　div-2</div>
<script>
var　x　=　document.querySelector("#div-1").nextSibling.nodeName;
document.getElementById("result").innerHTML = x;
</script>

Но, если удалить пробелы между DIV, то возвращаемое значение не будет #text:

<div　id="div-1">Здесь　есть　div-1</div><div　id="div-2">Здесь　есть　div-2</div>
<script>
var x = document.querySelector("#div-1").nextSibling.innerHTML;
document.getElementById("result").innerHTML = x;
</script>

Совместимость с браузерами

Полностью поддерживается всеми браузерами свойство nextSibling:

Технические детали

См. также

Референс HTML DOM:node Свойство .childNodes

Референс HTML DOM:node Свойство .firstChild

Референс HTML DOM:node Свойство .lastChild

Референс HTML DOM:node Свойство .parentNode

Референс HTML DOM:node Свойство .previousSibling

Референс HTML DOM:node Свойство .nodeName

Объект элемента HTML DOM