Các nút con của phần tử DOM HTML
Ví dụ
Lấy các nút con của phần tử <body>:
const nodeList = document.body.childNodes;
Hãy tự mình thử »Lấy số nút con trong "myDIV":
let numb = document.getElementById("myDIV").childNodes.length;
Hãy tự mình thử »Thêm ví dụ dưới đây.
Sự miêu tả
Thuộc tính childNodes
trả về một tập hợp (danh sách) các nút con của một phần tử.
Thuộc tính childNodes
trả về một đối tượng NodeList .
Thuộc tính childNodes
ở dạng chỉ đọc.
childNodes[0]
giống với firstChild
.
Quan trọng!
childNodes
trả về 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.
Thay thế:
Thuộc tính children
trả về các phần tử (bỏ qua 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 HTML so với các phần tử
Trong HTML DOM (Mô hình đối tượng tài liệu), tài liệu HTML là tập hợp các nút có (hoặc không có) nút con.
Các nút là các 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).
Anh chị em vs Anh chị em nguyên tố
Anh chị em là “anh em” và “chị em”.
Anh chị em là các nút có cùng cha mẹ (trong cùng danh sách nút con ).
Anh chị em phần tử là các phần tử có cùng cha mẹ (trong cùng danh sách con ).
Cú pháp
element .childNodes
Giá trị trả về
Kiểu | Sự miêu tả |
Sự vật | Một tập hợp các nút đối tượng NodeList . Các nút được sắp xếp như chúng xuất hiện trong tài liệu. |
Thêm ví dụ
Thay đổi màu nền của nút con thứ hai:
element.childNodes[1].style.backgroundColor = "yellow";
Hãy tự mình thử »Lấy văn bản của nút con thứ ba của phần tử <select>:
let text = document.getElementById("mySelect").childNodes[2].text;
Hãy tự mình thử »Hỗ trợ trình duyệt
element.childNodes
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 |