JQuery mengendalikan gaya css elemen_jquery

Kami sering menggunakan Javascript untuk menukar gaya elemen halaman. Salah satu cara ialah menukar meta halaman

Kelas CSS elemen (Kelas), dalam Javascript tradisional, kami biasanya memproses HTML

Ciri nama kelas Dom dilaksanakan; jQuery menyediakan tiga kaedah untuk melaksanakan fungsi ini,

Walaupun mereka mempunyai idea yang sama seperti kaedah tradisional, mereka menjimatkan banyak kod. Masih ayat yang sama –

“jQuery menjadikan kod JavaScript ringkas!”

1. addClass() – Tambah kelas CSS

Salin kod Kod adalah seperti berikut:

$(“#target”).addClass(“newClass”);
//#target merujuk kepada ID elemen yang perlu digayakan
//newClass merujuk kepada nama kelas CSS

2. removeClass() – Alih keluar kelas CSS

Salin kod Kod adalah seperti berikut:

$(“#target”).removeClass(“oldClass”);
//#target merujuk kepada ID elemen yang kelas CSSnya perlu dialih keluar
//oldClass merujuk kepada nama kelas CSS

3. toggleClass() – Tambah atau alih keluar kelas CSS: Jika kelas CSS sudah wujud, ia akan dialih keluar

Sebaliknya, jika kelas CSS tidak wujud, ia akan ditambah.

Salin kod Kod adalah seperti berikut:

$("#target").toggleClass("newClass")
//Jika elemen dengan ID "sasaran" mempunyai gaya CSS yang ditentukan, ia akan dialih keluar
//Sebaliknya, kelas CSS "newClass" akan diberikan kepada ID.

Dalam aplikasi sebenar, kami sering mentakrifkan kelas CSS ini dahulu, dan kemudian mencetuskannya melalui acara Javascript

Siarkan (seperti mengklik pada pautan) untuk menukar gaya elemen halaman. Selain itu, jQuery juga menyediakan kaedah

Kaedah

hasClass(“className”) digunakan untuk menentukan sama ada sesuatu elemen telah diberikan kelas CSS.

Di bawah ialah contoh lengkap.

Salin kod Kod adalah seperti berikut:

Gambar berkelip @-webkit-keyframes berkelip-kelip{ /*Ketelusan dari 0 hingga 1*/
           0%{                                                               kelegapan:0;                                                                                                                                                   100%{
            kelegapan:1;                                                                                                                                                   }  
.up{
-webkit-animasi: berkelip 1s kemudahan-keluar tidak terhingga; }  

Hahaha

Fungsi btnClick(){
//$(“#soccer”).removeClass(“up”); $(“#soccer”).toggleClass(“up”);
//$(“p:first”).removeClass(“intro”);
}  





Di atas adalah keseluruhan kandungan artikel ini tentang gaya CSS operasi jQuery saya harap anda akan menyukainya.