ParentNode.firstElementChild
The
ParentNode.firstElementChild
read-only property
returns the object's first child Element
, or null
if there
are no child elements.
This property was initially defined in the ElementTraversal
pure
interface. As this interface contained two distinct set of properties, one aimed
at Node
that have children, one at those that are children, they
have been moved into two separate pure interfaces, ParentNode
and
ChildNode
. In this case, firstElementChild
moved to
ParentNode
. This is a fairly technical change that shouldn't affect
compatibility.
Syntax
var element = node.firstElementChild;
Example
<ul id="foo">
<li>First (1)</li>
<li>Second (2)</li>
<li>Third (3)</li>
</ul>
<script>
var foo = document.getElementById('foo');
// yields: First (1)
console.log(foo.firstElementChild.textContent);
</script>
Polyfill for IE8, IE9 and Safari
// Overwrites native 'firstElementChild' prototype.
// Adds Document & DocumentFragment support for IE9 & Safari.
;(function(constructor) {
if (constructor &&
constructor.prototype &&
constructor.prototype.firstElementChild == null) {
Object.defineProperty(constructor.prototype, 'firstElementChild', {
get: function() {
var node, nodes = this.childNodes, i = 0;
while (node = nodes[i++]) {
if (node.nodeType === 1) {
return node;
}
}
return null;
}
});
}
})(window.Node || window.Element);
Specifications
Specification | Status | Comment |
---|---|---|
DOM The definition of 'ParentNode.firstElementChild' in that specification. |
Living Standard | Split the ElementTraversal interface in
ChildNode and ParentNode . This method is now
defined on the latter.The Document and DocumentFragment
implemented the new interfaces. |
Element Traversal Specification The definition of 'ElementTraversal.firstElementChild' in that specification. |
Obsolete | Added its initial definition to the ElementTraversal pure
interface and use it on Element . |
Browser compatibility
No compatibility data found for api.ParentNode.firstElementChild
.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.
See also
Element.nextElementSibling
ParentNode.lastElementChild
- The
ParentNode
andChildNode
pure interfaces. -
Object types implementing this pure interface:
Document
,Element
, andDocumentFragment
.