Thuộc tính HTML DOM firstElementChild

Thuộc tính firstElementChild trả về phần tử con đầu tiên (element node) của một phần tử cho trước. Chỉ tính các nút phần tử (element nodes), bỏ qua nút văn bản (text nodes) và nút chú thích (comment nodes). Đây là thuộc tính chỉ đọc (read-only).

Cú pháp

element.firstElementChild

Ví dụ

Ví dụ lấy phần tử con đầu tiên của một div:

<!DOCTYPE html>
<html>
<head>
<script>
  function getFirstElementChild() {
    var childHTML = document.getElementById("DIV1").firstElementChild.innerHTML;
    document.getElementById("Sample").innerHTML = "Phần tử con đầu tiên của div là: " + childHTML;
  }
</script>
</head>
<body>
<h1>Thuộc tính firstElementChild</h1>
<div id="DIV1">
  <p>Đây là phần tử p</p>
  <span>Đây là phần tử span</span>
</div>
<button onclick="getFirstElementChild()">LẤY CON ĐẦU</button>
<p id="Sample"></p>
</body>
</html>

Kết quả

Sau khi nhấn nút "LẤY CON ĐẦU", hiển thị: "Phần tử con đầu tiên của div là: Đây là phần tử p".

Giải thích

• Div id="DIV1" chứa <p> và <span> (không có khoảng trắng giữa các thẻ).
• Nút "LẤY CON ĐẦU" gọi hàm getFirstElementChild().
• Hàm truy xuất .firstElementChild của div (trả về <p> vì bỏ qua text node), lấy .innerHTML.
• Hiển thị nội dung của phần tử con đầu tiên.