HTML DOM 元素 firstChild

示例

返回 <ul> 元素的第一个子节点的 HTML 内容：

document.getElementById("myList").firstChild.innerHTML;

亲自试一试 »

获取 <select> 元素的第一个子节点的文本：

let text = document.getElementById("mySelect").firstChild.text;

亲自试一试 »

下面有更多示例。

描述

这个firstChild属性返回节点的第一个子节点。

这个firstChild属性返回一个节点对象。

这个firstChild属性是只读的。

这个firstChild属性与childNodes[0]。

重要的！

firstChild返回第一个孩子节点：元素节点、文本节点或注释节点。

元素之间的空白也是文本节点。

选择：

firstElementChild 属性

这个firstElementChild属性返回第一个孩子元素（忽略文本和注释节点）。

也可以看看：

节点属性

节点与元素

在 HTML DOM 术语中：

节点是所有节点（元素节点、文本节点和注释节点）。

元素之间的空白也是文本节点。

元素只是元素节点。

子节点 vs 子节点

子节点返回孩子节点（元素节点、文本节点和注释节点）。

孩子们返回孩子元素（不是文本和注释节点）。

第一个子元素与第一个元素子元素

第一个孩子返回第一个孩子节点（元素节点、文本节点或注释节点）。元素之间的空白也是文本节点。

第一个子元素返回第一个孩子元素（不是文本和注释节点）。

最后一个子项与最后一个元素子项

最后一个孩子返回最后一个孩子节点（元素节点、文本节点或注释节点）。元素之间的空白也是文本节点。

最后一个元素子元素返回最后一个孩子元素（不是文本和注释节点）。

语法

element.firstChild

node.firstChild

返回值

类型	描述
节点	节点的第一个子节点。 `null`如果没有孩子存在。

浏览器支持

element.firstChild是 DOM Level 1 (1998) 功能。

所有浏览器都完全支持它：


Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	9-11