Properti children HTML DOM Element

Definisi dan penggunaan

children Properti mengembalikan kumpulan element anak.

children Properti mengembalikan objek HTMLCollection.

Silakan lihat:

Properti firstElementChild

Properti lastElementChild

Properti nextElementSibling

Properti previousElementSibling

Properti childElementCount

Properti childNodes

Node HTML dan element

Di HTML DOM（Dokument Object Model）di mana dokumen HTML adalah kumpulan node yang memiliki (atau tidak memiliki) node anak.

NodeMerupakan referensi untuk node element, node teks, dan node catatan.

ElementJarak antara mereka juga adalah node teks.

Sementara element hanya node element.

Node anak dan element anak

childNodes KembalikanNode anak（node element, node teks, dan node catatan）.

children KembalikanElement anak（bukan node teks dan catatan）.

Kembar bersaudara dan element kembar.

SaudaraAdalah 'adik' dan 'saudara'.

SaudaraAdalah node yang memiliki node saudara (dalam yang sama childNodes daftar).

Saudara elemenAdalah elemen yang memiliki ayah yang sama (dalam yang sama children daftar).

Contoh

Contoh 1

Ambil koleksi anak elemen <body>:

const collection = document.body.children;

Coba Sendiri

Contoh 2

Berapa banyak elemen anak "myDIV":

let count = document.getElementById("myDIV").children.length;

Coba Sendiri

Contoh 3

Ubah latar belakang anak kedua elemen "myDIV":

const collection = document.getElementById("myDIV").children;
collection[1].style.backgroundColor = "yellow";

Coba Sendiri

Contoh 4

Ambil teks anak ketiga elemen <select> (indeks 2):

const collection = document.getElementById("mySelect").children[2].text;

Coba Sendiri

Contoh 5

Berkelilingi semua elemen anak <body> dan merubah latar belakang mereka:

const collection = document.body.children;
for (let i = 0; i < collecton.length; i++) {
  collection[i].style.backgroundColor = "red";
}

Coba Sendiri

Sintaks

element.children

Nilai yang dikembalikan

Tipe Deskripsi
Objek

Objek HTMLCollection.

Koleksi node elemen.

Elemen diurutkan berdasarkan posisinya muncul dalam dokumen.

Dukungan Peramban

element.children Adalah fitur DOM Level 1 (1998).

Semua peramban mendukungnya penuhnya:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Dukungan 9-11 Dukungan Dukungan Dukungan Dukungan