In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > properties > firstChild

firstChild property

Browser support:

Returns a reference to the first child of the current element.

The childNodes collection contains the direct descendants of an element, in source order. The firstChild property retrieves the first item from the childNodes collection. Similarly, the lastChild property returns the last item from the childNodes collection. The childNodes collection also contains the text and comment nodes, not only HTML elements. If you only need those HTML elements that are direct descendants of an element, use the children collection.

Syntax:

object.firstChild;

You can find the related objects in the Supported by objects section below.

This property is read-only.

Possible values:

Reference to the first child or null if it does not exist.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the firstChild property and childNodes collection:

<head>
    <script type="text/javascript">
        function GetFirstText () {
            var selectObj = document.getElementById ("mySelect");
            alert (selectObj.firstChild.text);
            // other way to get the first child
            alert (selectObj.childNodes[0].text);
        }
    </script>
</head>
<body>
    <button onclick="GetFirstText ();">Get the text of the first child!</button>
    <select id="mySelect" multiple="multiple"><option>Apple</option>
        <option>Peach</option>
        <option>Pear</option>
    </select>
</body>