tutorial pengembangan web terbaru
 

HTML DOM children Propery

<Elemen Object

Contoh

Dapatkan koleksi <body> anak elemen:

var c = document.body.children;
Cobalah sendiri "

Lebih "Try it Yourself" contoh di bawah ini.


Definisi dan Penggunaan

Properti anak mengembalikan koleksi elemen anak elemen ini, sebagai objek HTMLCollection.

Unsur-unsur dalam koleksi diurutkan seperti yang muncul dalam kode sumber dan dapat diakses oleh angka indeks. indeks dimulai dari 0.

Tip: Anda dapat menggunakan properti panjang dari objek HTMLCollection untuk menentukan jumlah elemen anak, maka Anda dapat loop melalui semua anak dan ekstrak info yang Anda inginkan.

Perbedaan antara properti ini dan childNodes , adalah bahwa childNodes mengandung semua node, termasuk node teks dan node komentar, sementara anak-anak hanya mengandung node elemen.


Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung properti.

Milik
children 2.0 9.0 * 3,5 4.0 10,0

* Catatan: Properti anak didukung penuh di IE6 ke IE8. Namun, dalam versi ini, ia mengembalikan node elemen DAN node komentar. IE9 + mengembalikan hanya node elemen.


Sintaksis

element .children

Rincian teknis

Kembali Nilai: Sebuah objek HTMLCollection hidup, yang mewakili koleksi node elemen. Unsur-unsur dalam koleksi dikembalikan diurutkan seperti yang muncul dalam kode sumber
DOM Versi Inti Level 1 Elemen Object

contoh

Contoh lebih

Contoh

Cari tahu berapa banyak anak-anak yang <div> elemen memiliki:

var c = document.getElementById("myDIV").children.length;

Hasil c akan:

2
Cobalah sendiri "

Contoh

Mengubah warna latar belakang dari elemen anak kedua dari <div> elemen:

var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow";
Cobalah sendiri "

Contoh

Dapatkan teks dari elemen anak ketiga (index 2) dari <select> elemen:

var c = document.getElementById("mySelect").children[2].text;

Hasil c akan:

Saab
Cobalah sendiri "

Contoh

Loop melalui semua anak dari <body> dan mengubah warna latar belakang mereka menjadi merah:

var c = document.body.children;
var i;
for (i = 0; i < c.length; i++) {
    c[i].style.backgroundColor = "red";
}
Cobalah sendiri "

Pages terkait

Referensi HTML DOM: childNodes Property


<Elemen Object