เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
สถานที่ให้บริการเด็กส่งกลับคอลเลกชันขององค์ประกอบองค์ประกอบเด็กเป็นวัตถุ HTMLCollection
องค์ประกอบในการเก็บรวบรวมจะถูกเรียงลำดับตามที่ปรากฏในรหัสแหล่งที่มาและสามารถเข้าถึงได้โดยตัวเลขดัชนี ดัชนีเริ่มต้นที่ 0
เคล็ดลับ: คุณสามารถใช้ระยะเวลาในคุณสมบัติของวัตถุ HTMLCollection เพื่อตรวจสอบจำนวนขององค์ประกอบเด็กแล้วคุณสามารถห่วงผ่านเด็กทุกคนและสารสกัดจากข้อมูลที่คุณต้องการ
ความแตกต่างระหว่างคุณสมบัตินี้และ childNodes เป็นที่ childNodes ประกอบด้วยโหนดทั้งหมดรวมทั้งต่อมน้ำข้อความและโหนดความคิดเห็นในขณะที่เด็กมีเพียงโหนดองค์ประกอบ
สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน
คุณสมบัติ | |||||
---|---|---|---|---|---|
children | 2.0 | 9.0 * | 3.5 | 4.0 | 10.0 |
* หมายเหตุ: คุณสมบัติที่เด็กได้รับการสนับสนุนอย่างเต็มที่ใน IE6 เพื่อ IE8 อย่างไรก็ตามในรุ่นนี้ก็จะส่งกลับโหนดองค์ประกอบและโหนดแสดงความคิดเห็น IE9 + ผลตอบแทนโหนดองค์ประกอบเท่านั้น
วากยสัมพันธ์
element .children
รายละเอียดทางเทคนิค
กลับค่า: | วัตถุ HTMLCollection สดคิดเป็นคอลเลกชันของโหนดองค์ประกอบ องค์ประกอบในการเก็บกลับจะถูกเรียงลำดับตามที่ปรากฏในรหัสที่มา |
---|---|
DOM รุ่น | หลักระดับ 1 ธาตุวัตถุ |
ตัวอย่างอื่น ๆ
ตัวอย่าง
หาวิธีหลายเด็ก <div> องค์ประกอบมี:
var c =
document.getElementById("myDIV").children.length;
ผลของ C จะได้รับ:
2
ลองตัวเอง» ตัวอย่าง
เปลี่ยนสีพื้นหลังขององค์ประกอบลูกคนที่สองของ <div> องค์ประกอบ:
var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow";
ลองตัวเอง» ตัวอย่าง
ได้รับข้อความขององค์ประกอบลูกที่สาม (index 2) ของ <select> องค์ประกอบ:
var c = document.getElementById("mySelect").children[2].text;
ผลของ C จะได้รับ:
Saab
ลองตัวเอง» ตัวอย่าง
ห่วงผ่านเด็กทุกคนของ <body> และเปลี่ยนสีพื้นหลังของพวกเขาเป็นสีแดง:
var c = document.body.children;
var i;
for (i = 0; i < c.length; i++)
{
c[i].style.backgroundColor = "red";
}
ลองตัวเอง» หน้าเว็บที่เกี่ยวข้อง
อ้างอิง HTML DOM: childNodes Property