The HTML DOM firstElementChild Property will return the first child of any node PreRequisites DOM (Document Object Model)
Parameters: No parameters are required.
Return value: The values returned by firstElementChild property are the following:
- A Node object: Representing the first child element of an element.
- Null: If there are no child elements.
Syntax
node.firstElementChild()
Example: In this example, we will use HTML DOM firstElementChild Property.
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM firstElementChild Property
</title>
</head>
<body>
<p>GeeksForGeeksTopics</p>
<ul id="Sections">
<li>Array</li>
<li>LinkedList</li>
<li>Stack</li>
<li>Queue</li>
<li>Tree</li>
<li>Graph</li>
</ul>
<p>
Click the button to get the first child
of the node having id is "Sections".
</p>
<!--button is used to run example function-->
<button onclick="example()">Click</button>
<p id="GeeksForGeeks sections first node"></p>
<script>
// JavaScript code to get the node whose
// id is "Section"
function example() {
// x is used to store the element
// whose id is "Sections".
let x = document.getElementById("Sections")
.firstElementChild.innerHTML;
document.getElementById("GeeksForGeeks sections" +
" first node").innerHTML = x;
}
</script>
</body>
</html>
Output:
Supported Browsers: The browser supported by DOM firstElementChild are listed below:
- Google Chrome 1 and above
- Edge 12 and above
- Internet Explorer 9 and above
- Firefox 3.5 and above
- Opera 10 and above
- Safari 4 and above