Selector.nextSibling Method

Selects succeeding sibling elements.

Syntax #

nextSibling #

Selector().nextSibling() → Selector

Finds the succeeding sibling elements of all nodes in the matched set.

nextSibling(index) #

Selector().nextSibling(index) → Selector

Finds the succeeding sibling elements of all nodes in the matched set and filters them by index.

Argument	Type	Description
`index`	Number	The zero-based index. Elements are indexed beginning from the closest sibling. If `index` is negative, the index is counted from the end of the matched set.

nextSibling(cssSelector) #

Selector().nextSibling(cssSelector) → Selector

Finds the succeeding sibling elements of all nodes in the matched set and uses a CSS selector to filter them.

Argument	Type	Description
`cssSelector`	String	The CSS selector string used to filter child elements.

nextSibling(filterFn, dependencies) #

Selector().nextSibling(filterFn, dependencies) → Selector

Finds the succeeding sibling elements of all nodes in the matched set and uses a predicate to filter them.

Argument	Type	Description
`filterFn`	Function	The predicate used to filter the elements.
`dependencies` (optional)	Object	Functions, variables, or objects passed to the `filterFn` function.

See Filtering DOM Elements by Predicates.

Examples #

// Selects all succeeding siblings of all 'a' elements.
Selector('a').nextSibling();

// Selects all closest succeeding siblings of all div elements.
Selector('div').nextSibling(0);

// Selects all furthest succeeding siblings of all pre elements.
Selector('pre').nextSibling(-1);

// Selects all p elements that are succeeding siblings of an hr element.
Selector('hr').nextSibling('p');

Filtering DOM Elements by Predicates #

Functions that search for elements in the DOM tree allow you to use a filterFn predicate to filter the matched set.

The filterFn predicate is executed on the client side and accepts the following parameters:

Parameter	Description
`node`	The current matching node.
`idx`	A matching node's zero-based index.
`originNode`	A node from the left-hand selector's matched set whose parents/siblings/children are being iterated.

Selector('section').prevSibling((node, idx, originNode) => {
    // node === the <section>'s preceding sibling node
    // idx === index of the current <section>'s preceding sibling node
    // originNode === the <section> element
});

The dependencies parameter allows you to pass objects to the filterFn client-side scope where they appear as variables.

const isNodeOk = (node, idx, originNode) => { /*...*/ };

Selector('ul').prevSibling((node, idx, originNode) => {
    return isNodeOk(node, idx, originNode);
}, { isNodeOk });