Hallo sobat program, alhamdulillah masih bertemu lagi dengan saya Rizal dan masih tetap diwebsite dumetschool. Dikesempatan pada hari ini saya akan mencoba dua fungsi dari javascript dan untuk judul artikel kali ini adalah Cara Memanfaatkan Fungsi querySelectorAll dan length pada Javascript
Sebelum kita mencoba memanfaatkan kedua fungsi tsb, saya harap teman-teman sudah mengenal dari fungsi querySelectorAll dan fungsi length pada javascript. Untuk teman-teman yang belum mengenal fungsi querySelectorAll silahkan dilihat dulu artikel saya sebelumnya yang membahas tentang Cara Menggunakan Fungsi querySelectorAll pada Javascript
Cara Memanfaatkan Fungsi querySelectorAll dan length pada Javascript
Oke lanjut kepembahasan, dipembahasan ini nantinya kita akan membuat tiga buah kelas dengan nama yang sama yaitu contoh. Dan nantinya class ketiga tsb kita pilih menggunakan fungsi querySelectorAll lalu kita hitung berapa banyak class tsb digunakan dengan menggunakan fungsi length
Cara Memanfaatkan Fungsi querySelectorAll dan length pada Javascript
Oke baiklah mari kita lakukan, pertama-tama jalankan/run text-editornya lalu kemudian ketiklah kode HTML nya seperti pada contoh dibawah ini
HTML
1
2
3
4
5
6
7
8
9
10
sebelas
12
13
14
limabelas
16
17
18
19
Menghitung Banyak Kelas CSS
Lorem Ipsum adalah hanya boneka teks dari yang cetakan
lama didirikan fakta bahwa a pembaca akan menjadi terganggu
Ada ada banyak variasi dari bagian dari Lorem Ipsum
Hitung
Jika sudah, langkah selanjutnya tambahkan sedikit CSS seperti pada contoh dibawah ini
CSS
1
. wadah {lebar. 650px; margin. 20px otomatis; latar belakang. lightgrey; pengisian. 20 piksel;}
Langkah terakhir, teman-teman tambahkan kode Javascript beserta fungsinya seperti pada contoh dibawah ini
JAVASCRIPT
1
2
3
4
5
6
fungsi Fungsiku() {
var x = dokumen.querySelectorAll(". contoh");
dokumen. getElementById("hasil"). innerHTML = x. panjang;
}
Jika sudah, silahkan disimpan lalu dijalankan dibrowser yang teman-teman gunakan. Jika benar maka hasilnya akan menjadi seperti pada contoh gambar dibawah ini
Jadi hasil diatas adalah banyaknya contoh class yang digunakan sebanyak tiga (3) hehehe. Jadi seperti itu lah contoh sederhana dari pembahasan kita kali ini tentang Cara Memanfaatkan Fungsi querySelectorAll dan length pada Javascript. Dan Silahkan teman-teman coba explore lagi ya
Oke cukup sekian dari pembahasan kita kali ini semoga dapat bermanfaat dan sampai bertemu dipembahasan selanjutnya