Phần tử DOM HTML cuối cùng
Ví dụ
Trả về nội dung HTML của nút con cuối cùng của phần tử <ul>:
document.getElementById("myList").lastChild.innerHTML;
Hãy tự mình thử »Lấy văn bản của nút con cuối cùng của phần tử <select>:
let text = document.getElementById("mySelect").lastChild.text;
Hãy tự mình thử »Thêm ví dụ dưới đây.
Sự miêu tả
Thuộc tính lastChild
trả về nút con cuối cùng của nút.
Thuộc tính lastChild
trả về một đối tượng nút.
Thuộc tính lastChild
là chỉ đọc.
Quan trọng!
lastChild
trả về nút con của danh sách: Nút phần tử, nút văn bản hoặc nút nhận xét.
Khoảng trắng giữa các phần tử cũng là các nút văn bản.
Thay thế:
Thuộc tính lastElementChild
trả về phần tử con cuối cùng (bỏ qua các nút văn bản và nhận xét).
Xem thêm:
Thuộc tính anh chị em tiếp theo
Thuộc tính nút
Nút và phần tử
Trong thuật ngữ HTML DOM:
Các nút là tất cả các nút (nút phần tử, nút văn bản và nút nhận xét).
Khoảng trắng giữa các phần tử cũng là các nút văn bản.
Các phần tử chỉ là các nút phần tử.
conNodes vs trẻ em
childNodes trả về các nút con (nút phần tử, nút văn bản và nút nhận xét).
trẻ em trả về các phần tử con (không phải nút văn bản và nhận xét).
FirstChild vs FirstElementChild
firstChild trả về nút con đầu tiên (nút phần tử, nút văn bản hoặc nút nhận xét). Khoảng trắng giữa các phần tử cũng là các nút văn bản.
firstElementChild trả về phần tử con đầu tiên (không phải nút văn bản và nhận xét).
LastChild vs LastElementChild
LastChild trả về nút con cuối cùng (nút phần tử, nút văn bản hoặc nút nhận xét). Khoảng trắng giữa các phần tử cũng là các nút văn bản.
LastElementChild trả về phần tử con cuối cùng (không phải nút văn bản và nhận xét).
Cú pháp
element .lastChild
hoặc
node .lastChild
Giá trị trả về
Kiểu | Sự miêu tả |
Nút | Con cuối cùng của một nút.null nếu không có con nào tồn tại. |
Thêm ví dụ
Ví dụ này cho thấy khoảng trắng có thể can thiệp như thế nào:
Cố gắng lấy tên nút của nút con cuối cùng của "myDIV":
<div id="myDIV">
<p>Looks like first child</p>
<p>Looks like last Child</p>
</div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>
Hãy tự mình thử »Tuy nhiên, nếu bạn xóa khoảng trắng khỏi nguồn thì sẽ không có nút #text nào trong "myDIV":
<div id="myDIV"><p>First child</p><p>Last Child</p></div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>
Hãy tự mình thử »Hỗ trợ trình duyệt
element.lastChild
là tính năng DOM Cấp 1 (1998).
Nó được hỗ trợ đầy đủ trong tất cả các trình duyệt:
Chrome | Edge | Firefox | Safari | Opera | IE |
Yes | Yes | Yes | Yes | Yes | 9-11 |