Hello guys! Kembali lagi bersama Miniblog dari Inzaghi's Blog! Jika sebelumnya sudah membuat jQuery DOM Manipulation, kali ini kita akan membuat Manipulasi CSS dengan menggunakan jQuery Method removeClass().
%20in%20jQuery%20Method.png)
Sumber : Tutorialsteacher.com dan Tutorialspoint.com
jQuery menyediakan metode removeClass() untuk menghapus kelas CSS yang ada dari elemen HTML yang sesuai. Berikut adalah sintaks dari metode removeClass() :
$(selector).removeClass(className);
Metode ini mengambil parameter yang merupakan satu atau lebih kelas yang dipisahkan oleh spasi yang akan dihapus dari atribut kelas setiap elemen yang sesuai. Lebih dari satu kelas dapat dihapus sekaligus, dipisahkan oleh spasi, dari himpunan elemen yang sesuai, seperti berikut :
$(selector).removeClass("Class1 Class2");Misalkan HTML berikut dengan kelas-kelas CSS yang telah didefinisikan :
<style>.big{ font-weight: bold; font-size:20px; }.small{ font-weight: normal; font-size:10px; }</style><body><div class="container"><h2>jQuery removeClass() Method</h2><div class="hello big">Hello</div><div class="goodbye small">Goodbye</div></div></body>
Jika kita menggunakan metode removeClass() seperti berikut :
$(".hello").removeClass("big");$(".goodbye").removeClass("small");
Ini akan menghasilkan hasil berikut :
<body><div class="container"><h2>jQuery removeClass() Method</h2><div class="hello">Hello</div><div class="goodbye">Goodbye</div></div></body>
Contoh :
<!DOCTYPE html><html><head><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script><script>$(document).ready(function() {$("button").click(function(){$( ".hello" ).removeClass("big" );$( ".goodbye" ).removeClass("small" );});});</script><style>.big{ font-weight: bold; font-size:20px; }.small{ font-weight: normal; font-size:10px; }</style></head><body><div class="container"><h1>jQuery removeClass() Method Demo</h1><div class="hello big">Hello</div><div class="goodbye small">Goodbye</div></div><br><button>Remove Class</button></body></html>
Hasil Output :
%20Method%20Demo.gif)
Mohon maaf apabila ada kesalahan sedikit pun pada Kode Program ini.
Terima Kasih 😀😊😘👌👍 :)