Hai teman-teman semuanya, gimana masih semangat belajarnya, kita lanjut lagi yuk belajarnya, pada pembahasan kali ini saya akan membahas tentang classlist toggle pada dom javascript,

teman-teman pasti pernah mendengan kata toggle, yups bagi teman-teman yang sudah belajar jquery pasti tau apa itu toggle, yups toggle adalah alat bantu atau jalan pintas untuk membuat efek timbal balik, toggle sangat berguna untuk memanipulasi suatu element pada javascript atau jquery, nah pada kasus kali ini kita akan memperaktekan bagai mana kerja dari classlist toggle pada DOM jacascript.

Oke pertama teman-teman silahkan buat sebuah file html dan ketikan script berikut ini:

Script diatas saya membuat sebuah elemet p dan saya membuat pengatura untuk class tagline yang nantinya akan kita mainkan dengan classlist toggle nanti,

kita sudah maka hasilnya masih tulisan biasa, sekarang coba teman-teman tambahkan script seperti berikut ini:

Saya mengatur untuk element p yang ke 0 ketika diklik akan menambahkan class tagline dan jika kita klik lagi maka class tagline akan hilang begitu pula sebaliknya, maka gambarnya akan seperti berikut ini:

ketika belum di klik

classlist toggle pada dom javascript 1

setelah diklik:

classlist toggle pada dom javascript 2

dan ini bisa berefek terus menerus,

Oke teman-teman gimana? cukup mudah bukan? untuk tutorial kali ini tentang classlist toggle pada dom javascript saya rasa cukup sampai sini dulu, selamat mencoba ,

Terrima kasih

 

WhatsApp chat