firstElementChild property
The firstElementChild property
contains the first child element. All
tags that are directly located inside
a block are considered child elements. If
the element has no children, then
null is returned.
Syntax
element.firstElementChild;
Example
Let's get a content of the element's first child:
<div id="parent">
<p>1</p>
<p>2</p>
</div>
let parent = document.querySelector('#parent');
let text = parent.firstElementChild.textContent;
console.log(text);
The code execution result:
'1'
Example
And now an element has no children
and therefore null will be
displayed:
<div id="parent"></div>
let parent = document.querySelector('#parent');
console.log(parent.firstElementChild);
The code execution result:
null
See also
-
the
lastElementChildproperty
that contains the last element -
the
childrenproperty
that contains child elements -
the
firstChildproperty
that contains the first node