โหนดลูกขององค์ประกอบ HTML DOM
วัตถุธาตุตัวอย่าง
รับโหนดย่อยขององค์ประกอบ <body>:
const nodeList = document.body.childNodes;
ตัวอย่างเพิ่มเติมด้านล่าง
ความหมายและการใช้งาน
คุณสมบัติchildNodes
ส่งคืนคอลเลกชัน (รายการ) ของโหนดย่อยขององค์ประกอบ
คุณสมบัติchildNodes
ส่งคืนวัตถุ NodeList
คุณสมบัติchildNodes
เป็นแบบอ่านอย่างเดียว
บันทึก
ช่องว่างภายในองค์ประกอบถือเป็นโหนดข้อความ
ความคิดเห็นยังถือเป็นโหนด
childNodes[0]
firstChild
ก็เหมือนกับ
ความแตกต่าง
คุณสมบัติchildNodes
ส่งคืนโหนดย่อยทั้งหมดรวมถึงโหนดข้อความและโหนดความคิดเห็น ในขณะที่children
คุณสมบัติส่งคืนเฉพาะองค์ประกอบย่อยเท่านั้น
ดูสิ่งนี้ด้วย:
The Element เด็ก พร็อพเพอร์ตี้
NodeList
NodeList คือคอลเล็กชัน (รายการ) ที่เหมือนอาร์เรย์ของ Node Objects
NodeList มี คุณสมบัติ ความยาวที่ส่งคืนจำนวนโหนดในรายการ
โหนดสามารถเข้าถึงได้โดยหมายเลขดัชนี ดัชนีเริ่มต้นที่ 0
ไวยากรณ์
element.childNodes
คืนมูลค่า
พิมพ์ | คำอธิบาย |
วัตถุ | ชุดวัตถุNodeList ของโหนด โหนดจะถูกจัดเรียงตามที่ปรากฏในเอกสาร |
ตัวอย่างเพิ่มเติม
จำนวนโหนดย่อยใน <div> องค์ประกอบ:
let numb = document.getElementById("myDIV").childNodes.length;
เปลี่ยนสีพื้นหลังของโหนดย่อยที่สอง:
document.getElementById("myDIV").childNodes[1].style.backgroundColor = "yellow";
รับข้อความของโหนดย่อยที่สามขององค์ประกอบ <select>:
let text = document.getElementById("mySelect").childNodes[2].text;
หน้าที่เกี่ยวข้อง
คุณสมบัติ parentNode ขององค์ประกอบ
The Element nextSibling Property
รองรับเบราว์เซอร์
element.childNodes
เป็นคุณลักษณะ DOM ระดับ 1 (1998)
ได้รับการสนับสนุนอย่างเต็มที่ในเบราว์เซอร์ทั้งหมด:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |
วัตถุธาตุ