Metode toggleClass
Metode toggleClass bergantian menambah/menghapus
kelas CSS: jika tidak ada - akan menambah, jika ada - akan menghapus.
Sintaks
Satu kelas CSS:
$(selektor).toggleClass(nama kelas);
Hanya menambah atau menghapus kelas CSS tergantung
pada parameter kedua, yang menerima nilai
true atau false:
$(selektor).toggleClass(nama kelas CSS, state);
Beberapa kelas CSS:
$(selektor).toggleClass(['kelas1', 'kelas2', 'kelas3', '...']);
Hanya menambah atau menghapus kelas CSS tergantung pada parameter kedua:
$(selektor).toggleClass(['kelas1', 'kelas2', 'kelas3', '...'], state');
Penerapan fungsi ke setiap elemen dalam kumpulan,
state dapat berupa true atau false,
dan memberi tahu metode - hanya menambah atau hanya
menghapus kelas CSS:
$(selektor).toggleClass(function(index, currentClasses, state), [state]);
Contoh
Paragraf kita sudah memiliki dua kelas. Mari
tambahkan kelas www:
<p id="test" class="eee ggg">teks</p>
$('#test').toggleClass('www');
Kode HTML akan menjadi seperti ini:
<p id="test" class="eee ggg www">teks</p>
Contoh
Dan sekarang kelas www sudah ada di elemen
- mari hapus:
<p id="test" class="eee ggg www">teks</p>
$('#test').toggleClass('www');
Kode HTML akan menjadi seperti ini:
<p id="test" class="eee ggg">teks</p>
Lihat juga
-
metode
addClass,removeClass,hasClass -
Properti JavaScript
classList,
yang dapat digunakan untuk bergantian menambah/menghapus kelas dengan JavaScript murni
