Web/API/Node/nextSibling

From Get docs
< Web/API‎ | Node


The Node.nextSibling read-only property returns the node immediately following the specified one in their parent's childNodes, or returns null if the specified node is the last child in the parent element.

Syntax

nextNode = node.nextSibling

Notes

Gecko-based browsers insert text nodes into a document to represent whitespace in the source markup. Therefore a node obtained, for example, using Node.firstChild or Node.previousSibling may refer to a whitespace text node rather than the actual element the author intended to get.

See Whitespace in the DOM and W3C DOM 3 FAQ: Why are some Text nodes empty? for more information.


Element.nextElementSibling may be used to obtain the next element skipping any whitespace nodes, other between-element text, or comments.

Example

<div id="div-1">Here is div-1</div>
<div id="div-2">Here is div-2</div>

<script>
var el = document.getElementById('div-1').nextSibling,
    i = 1;

console.group('Siblings of div-1:');

while (el) {
  console.log(i, '. ', el.nodeName);
  el = el.nextSibling;
  i++;
}

console.groupEnd();
</script>

/**************************************************
  The console displays the following:

     Siblings of div-1

      1. #text
      2. DIV
      3. #text
      4. SCRIPT

**************************************************/

In the above example, #text nodes are inserted in the DOM where whitespace occurs between tags (i.e. after the closing tag of an element and before the opening tag of the next).

The possible inclusion of text nodes must be allowed for when traversing the DOM using nextSibling. See the resources in the Notes section.

Specifications

Specification Status Comment
DOMThe definition of 'Node.nextSibling' in that specification. Living Standard No change
Document Object Model (DOM) Level 2 Core SpecificationThe definition of 'Node.nextSibling' in that specification. Obsolete No change
Document Object Model (DOM) Level 1 SpecificationThe definition of 'Node.nextSibling' in that specification. Obsolete Initial definition

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
nextSibling Chrome

Full support 1

Edge

Full support 12

Firefox

Full support 1

IE

Full support 5.5

Opera

Full support 7

Safari

Full support 1.1

WebView Android

Full support 1

Chrome Android

Full support 18

Firefox Android

Full support 4

Opera Android

Full support 10.1

Safari iOS

Full support 1

Samsung Internet Android

Full support 1.0

Legend

Full support  
Full support


See also