HTML DOM Element previousElementSibling attribute
- Previous page previousSibling
- Next page querySelector()
- Go back to the previous level HTML DOM Elements Object
Definition and Usage
previousElementSibling
The attribute returns the previous element at the same tree level.
previousElementSibling
The attribute is read-only.
See also:
HTML node and element
In HTML DOM(Document Object Model), an HTML document is a collection of nodes (or without child nodes).
NodeRefers to element nodes, text nodes, and comment nodes.
ElementThe whitespace between elements is also a text node.
While element is just an element node.
Sibling vs element sibling
SiblingIs 'brother' and 'sister'.
SiblingIs a node that has the same parent node (in the same childNodes in the list).
Element siblingIs an element that has the same parent element (in the same children in the list).
Child nodes vs child elements
childNodes ReturnsChild node(Element node, text node, and comment node).
children ReturnsChild element(Not text and comment nodes).
nextSibling vs nextElementSibling
nextSibling Returns the nextNode(Element node, text node, or comment node). The whitespace between elements is also a text node.
nextElementSibling Returns the nextElement(Does not return text and comment nodes).
previousSibling vs previousElementSibling
previousSibling Returns the previousNode(Element node, text node, or comment node). The whitespace between elements is also a text node.
previousElementSibling Returns the previousElement(Does not return text and comment nodes).
Example
Returns the HTML content of the previous sibling:
let text = element.previousElementSibling.innerHTML;
Syntax
element.previousElementSibling
Return value
Type | Description |
---|---|
Element | Previous sibling element. |
null | If there is no preceding sibling. |
Browser support
element.previousElementSibling
It is a DOM Level 3 (2004) feature.
All browsers fully support it:
Chrome | IE | Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
Chrome | IE | Edge | Firefox | Safari | Opera |
Support | 9-11 | Support | Support | Support | Support |
- Previous page previousSibling
- Next page querySelector()
- Go back to the previous level HTML DOM Elements Object