Satu Kelas untuk Styling di JavaScript
Misalkan kita memiliki dua kelas, yang kita berikan kepada elemen tergantung pada keadaannya:
div.active {
color: red;
}
div.passive {
color: black;
}
Sebenarnya, keberadaan dua kelas di sini
dapat mengganggu. Dalam hal ini, kita bisa
menulis ulang gaya tersebut sebagai berikut
melalui pemilih :not:
div.active {
color: red;
}
div:not(active) {
color: black;
}
Dalam hal ini, kita dapat dengan mudah meng-toggle kelas kita, menjadikan elemen aktif atau tidak aktif:
elem.classList.toggle('active');
Diberikan beberapa paragraf. Buatlah agar setiap paragraf pada klik pertama diwarnai menjadi merah, dan pada klik kedua - diwarnai kembali menjadi hitam.