Thuộc tính lastChild trong JavaScript

• Bùi Tấn Lực
• 113
• 12/09/2025

Thuộc tính lastChild trong JavaScript dùng để lấy nút con cuối cùng của phần tử HTML, nút con bao gồm thẻ HTML, khoảng trắng, chú thích,..., chi tiết như nào hãy cùng chúng tôi phân tích:

Thuộc tính lastChild trong JavaScript

Chức năng của Thuộc tính lastChild trong JavaScript

Thuộc tính lastChild trong JavaScript dùng để lấy nút con cuối cùng của phần tử HTML, nút con bao gồm thẻ HTML, khoảng trắng, chú thích,...

Bạn có thể xem vị trí cuối cùng trong phần tử HTML là cái gì bằng cách alert() ra để xem.

Bạn có thể lấy HTML, giá trị,... của các thẻ HTML nằm ở vị trí cuối cùng.

Bạn có thể hành động lên phần tử con cuối cùng.

Cú pháp của Thuộc tính lastChild trong JavaScript

let ketqua = tenbiencha.lastChild.hanhdong;

tenbiencha: Tên biến cha là phần tử HTML cha cần lấy thông tin phần tử con cuối cùng, thường dùng document.getElementById("giá trị id") để lấy.

hanhdong: Hành động để lấy nội dung hoặc tên thẻ,...

ketqua: Kết quả trả về.

tenbiencha.lastChild.hanhdong;

tenbiencha: Tên biến cha là phần tử HTML cha cần hành động lên phần tử con cuối cùng, thường dùng document.getElementById("giá trị id") để lấy.

hanhdong: Hành động để css hoặc tạo giá trị,...

Code Thuộc tính lastChild trong JavaScript

document.getElementById("ulid").lastChild.style.color = "red";

let valueulhtml = document.getElementById("ulid").lastChild.outerHTML;

<h3>lastChild li cuối cùng</h3>
<ul id="ulid" style="border:1px solid red;padding:20px;margin-bottom:10px"><li>Trang chủ</li><li>Giới thiệu</li><li>Blog</li><li>Liên hệ</li></ul>
<div>Lấy nút con cuối cùng là thẻ ul (HTML): <span id="ulhtml"></span></div>
<h3>lastChild p cuối cùng</h3>
<div id="divp" style="border:1px solid red;padding:20px;margin-bottom:10px"><p>Xin Chào!</p><p>Cảm ơn!</p></div>
<div>Lấy nút con cuối cùng là thẻ p (HTML): <span id="phtml"></span></div>
<h3>lastChild input cuối cùng</h3>
<div id="divinput" style="border:1px solid red;padding:20px;margin-bottom:10px"><input type="text" value="1"><input type="text" value="2"></div>
<div>Lấy nút con cuối cùng là thẻ input(Value): <span id="inputhtml"></span></div>
<h3>Khoảng trắng cuối cùng</h3>
<div id="divkt" style="border:1px solid red;padding:20px;margin-bottom:10px"><input type="text" value="1"><input type="text" value="2"> </div>
<div>Lấy nút con cuối cùng là khoảng trắng(html): <span id="kthtml"></span></div>
<h3>lastChild chú thích cuối cùng</h3>
<div id="divcthich"><p>Xin Chào!</p><!--Chú thích--></div>
<div>Lấy nút con cuối cùng là chú thích (HTML): <span id="cthichhtml"></span></div>
<script>
// lastChild li cuối cùng
let valueulhtml = document.getElementById("ulid").lastChild.outerHTML;
//alert(valueulhtml);
document.getElementById("ulid").lastChild.style.color = "red";
document.getElementById("ulhtml").innerHTML = valueulhtml;
// lastChild p cuối cùng
let valuephtml = document.getElementById("divp").lastChild.innerHTML;
document.getElementById("phtml").innerHTML = valuephtml;
// lastChild input cuối cùng
let inputvalue = document.getElementById("divinput").lastChild.value;
document.getElementById("inputhtml").innerHTML = inputvalue;
// Khoảng trắng cuối cùng
let khoangtrang = document.getElementById("divkt").lastChild.nodeValue;
document.getElementById("kthtml").innerHTML = khoangtrang;
// lastChild chú thích cuối cùng
let chuthichhtml = document.getElementById("divcthich").lastChild.nodeValue;
document.getElementById("cthichhtml").innerHTML = chuthichhtml;
</script>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Thuộc tính lastChild trong JavaScript.

Bùi Tấn Lực

Chia sẻ nội dung đánh giá của bạn về Thuộc tính lastChild trong JavaScript
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Đăng ký tư vấn miễn phí

Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn