Dokumen HTML DOM getElementsByClassName()
Contoh
Dapatkan semua elemen dengan class="example":
const collection = document.getElementsByClassName("example");
Dapatkan semua elemen dengan kelas "contoh" dan "warna":
const collection = document.getElementsByClassName("example color");
Lebih banyak contoh di bawah ini.
Definisi dan Penggunaan
Metode getElementsByClassName()
mengembalikan koleksi elemen dengan nama kelas tertentu.
Metode getElementsByClassName()
mengembalikan HTMLCollection .
Properti getElementsByClassName()
ini hanya-baca.
Koleksi HTML
Sebuah HTMLCollection adalah kumpulan node HTML.
Node dalam koleksi dapat diakses dengan nomor indeks. Indeks dimulai dari 0.
Properti panjang mengembalikan jumlah elemen dalam koleksi.
Lihat juga:
Metode getElementById() Dokumen
Metode getElementsByTagName() Dokumen
Metode querySelector() Dokumen
Sintaksis
document.getElementsByClassName(classname)
Parameter
Parameter | Description |
classname | Required. The class name of the elements. Search for multiple class names separated by spaces like "test demo". |
Nilai Kembali
Jenis | Keterangan |
Obyek. | Sebuah objek HTMLCollection . Kumpulan elemen dengan nama kelas yang ditentukan. Elemen diurutkan saat muncul di dokumen. |
Lebih Banyak Contoh
Jumlah elemen dengan class="contoh":
let numb = document.getElementsByClassName("example").length;
Ubah warna latar belakang semua elemen dengan class="example":
const collection = document.getElementsByClassName("example");
for (let i = 0; i < collection.length; i++) {
collection[i].style.backgroundColor = "red";
}
Halaman Terkait
Tutorial CSS: Sintaks CSS
Referensi CSS: CSS .class Selector
Referensi DOM HTML: elemen .getElementsByClassName()
Referensi DOM HTML: Properti className
Referensi DOM HTML: Properti classList
Referensi DOM HTML: Objek Gaya
Dukungan Peramban
document.getElementsByClassName()
adalah fitur DOM Level 1 (1998).
Ini didukung penuh di semua browser:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |