Bagaimana untuk mengalih keluar gaya daripada elemen menggunakan JQuery

JQuery ialah perpustakaan JavaScript yang sangat popular Pembangun sering menggunakan JQuery untuk mengendalikan elemen dalam halaman HTML. Dalam JQuery, kita boleh menggunakan beberapa kaedah mudah untuk memanipulasi gaya elemen, seperti menambah gaya, mengalih keluar gaya atau menyunting gaya.

Artikel ini akan menumpukan pada cara menggunakan JQuery untuk mengalih keluar gaya elemen.

1. Gunakan kaedah removeClass()

JQuery menyediakan kaedah removeClss() untuk mengalih keluar satu atau lebih gaya elemen.

Format sintaks adalah seperti berikut:

$(selector).removeClass(classname,function);

Antaranya, nama kelas parameter ialah nama kelas CSS yang perlu dialih keluar. Berbilang kelas CSS boleh dialih keluar pada masa yang sama, dipisahkan dengan ruang antara nama kelas.

Fungsi parameter pilihan kedua ialah fungsi panggil balik yang perlu dilaksanakan selepas mengalih keluar kelas CSS.

Sebagai contoh, kita boleh menggunakan kaedah removeClass() untuk mengalih keluar kelas CSS tertentu elemen, seperti berikut:

$("p").removeClass("myClass");

Nota: Jika anda perlu mengalih keluar semua kelas CSS bagi elemen, Anda boleh menggunakan kaedah removeClass() tanpa menghantar sebarang parameter:

$("p").removeClass();

2. Gunakan kaedah removeAttr()

Dalam JQuery, kita juga boleh gunakan kaedah removeAttr() untuk mengalih keluar atribut daripada elemen HTML. Sesetengah elemen HTML (seperti imej) mungkin mempunyai gaya sebaris, dan atribut ini boleh dialih keluar dengan kaedah removeAttr().

Format sintaks adalah seperti berikut:

$(selector).removeAttr(attributeName);

Antaranya, atribut parameterName ialah nama atribut elemen HTML yang perlu dialih keluar.

Berikut ialah contoh mengalih keluar atribut src elemen img:

$("img").removeAttr("src");

3. Gunakan kaedah css()

Selain itu kepada dua kaedah di atas Selain itu, kita juga boleh menggunakan kaedah css() untuk mengalih keluar gaya sesuatu elemen. Kaedah ini membolehkan kami mengalih keluar gaya elemen dengan menetapkan nilai sifat CSS kepada rentetan kosong.

Format sintaks adalah seperti berikut:

$(selector).css(property,value);

Antaranya, sifat parameter ialah nama sifat CSS yang perlu dialih keluar, dan nilai parameter hendaklah ditetapkan kepada rentetan kosong.

Berikut ialah contoh kod yang berkaitan:

$("p").css("font-size", "");

4. Mengalih keluar berbilang gaya untuk berbilang elemen

Seperti yang dinyatakan sebelum ini, kaedah removeClass( ) boleh mengalih keluar satu atau lebih kelas CSS pada masa yang sama. Walau bagaimanapun, jika anda perlu mengalih keluar berbilang gaya daripada berbilang elemen pada masa yang sama, anda perlu menggunakan kaedah each().

$("p").each(function(){
    $(this).removeClass("myClass1 myClass2");
});

Dalam contoh di atas, kita mula-mula memilih semua elemen p, dan kemudian menggunakan kaedah each() untuk menggelungkan setiap elemen p.

Dalam setiap gelung, kami menggunakan JQuery sekali lagi untuk memilih elemen semasa, dan kemudian menggunakan kaedah removeClass() untuk mengalih keluar dua kelas CSS.

5. Alih keluar kelas css dengan awalan yang ditentukan

Jika anda perlu mengalih keluar kelas css dengan awalan yang ditentukan, anda boleh menggunakan kaedah attr() JQuery dan indexOf( ) kaedah untuk melengkapkan.

$("[class^='myPrefix']").removeAttr("class");

Dalam contoh di atas, kami mula-mula memilih semua elemen yang nilai atribut kelasnya bermula dengan 'myPrefix', dan kemudian gunakan kaedah removeAttr() untuk memadamkan atribut kelas mereka.

Ringkasan:

Di atas ialah beberapa cara untuk menggunakan JQuery untuk mengalih keluar gaya elemen. Menggunakan JQuery boleh mengalih keluar gaya elemen dengan cepat dan mudah, dan JQuery juga menjadikan pembangunan web lebih mudah.

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar gaya daripada elemen menggunakan JQuery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!