First child và last child node trong JavaScript

Lấy first và last child node của node cụ thể, JS cung cấp firstChild và lastChild.

firstChild

Cú pháp

node.firstChild;

Ví dụ

<html> <body> <ul id = "list"><li>Tesla</li><li>Spacex</li><li>Solarcity</li></ul> <p id="first"></p> <script> var list = document.getElementById("list").firstChild.innerHTML; document.getElementById("first").innerHTML = list; </script> </body> </html>

Kết quả

Tesla Spacex Solarcity Tesla

lastChild

Cú pháp

node.lastChild;

Ví dụ

<html> <body> <ul id = "list"><li>Tesla</li><li>Spacex</li><li>Solarcity</li></ul> <p id="first"></p> <script> var list = document.getElementById("list").lastChild.innerHTML; document.getElementById("first").innerHTML = list; </script> </body> </html>

Kết quả

Tesla Spacex Solarcity Solarcity

QUAN TRỌNG: firstChild/lastChild trả về bất kỳ node nào (kể cả text node trắng/khoảng trắng). Thường dùng firstElementChild/lastElementChild để chỉ lấy Element node (tag HTML).