Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > jquery menukar gaya elemen

jquery menukar gaya elemen

王林
Lepaskan: 2023-05-25 12:07:50
asal
1387 orang telah melayarinya

jQuery ialah perpustakaan JavaScript yang menjadikan penulisan JavaScript lebih ringkas, mudah dibaca dan mudah diselenggara. Dalam pembangunan web, kita selalunya perlu menukar gaya elemen. Artikel ini akan menunjukkan cara menggunakan jQuery untuk menukar gaya elemen dengan memperkenalkan kaedah berkaitan gaya jQuery.

  1. kaedah.css()

Untuk menukar gaya elemen, kita boleh menggunakan kaedah .css(). Kaedah ini boleh digunakan untuk mendapatkan dan menetapkan sifat CSS elemen. Untuk menetapkan harta kita perlu lulus dua parameter: nama harta dan nilai harta. Contohnya:

$(selector).css('property', 'value');
Salin selepas log masuk

Antaranya, pemilih ialah pemilih elemen yang perlu dikendalikan ialah nama sifat CSS yang hendak diubah, seperti "warna latar belakang", "saiz fon ", dsb.; nilai ialah nilai yang akan ditetapkan. Nilai sifat CSS.

Sebagai contoh, kod berikut akan menukar warna latar belakang elemen dengan id "myDiv" kepada merah:

$('#myDiv').css('background-color', 'red');
Salin selepas log masuk
  1. .addClass() kaedah

Jika anda ingin menambah satu atau lebih kelas CSS pada elemen, kami boleh menggunakan kaedah .addClass().

$(selector).addClass(classname);
Salin selepas log masuk

Di mana nama kelas ialah nama satu atau lebih kelas CSS untuk ditambahkan pada elemen, dipisahkan dengan ruang.

Sebagai contoh, kod berikut akan menambah kelas CSS bernama "dipilih" pada elemen dengan id "myDiv":

$('#myDiv').addClass('selected');
Salin selepas log masuk
  1. .removeClass() kaedah

Jika kita ingin mengalih keluar satu atau lebih kelas CSS daripada elemen, kita boleh menggunakan kaedah .removeClass().

$(selector).removeClass(classname);
Salin selepas log masuk

Di mana nama kelas ialah nama satu atau lebih kelas CSS untuk dialih keluar daripada elemen, dipisahkan dengan ruang.

Sebagai contoh, kod berikut akan mengalih keluar kelas CSS bernama "selected" daripada elemen dengan id "myDiv":

$('#myDiv').removeClass('selected');
Salin selepas log masuk
  1. .toggleClass() kaedah

Jika anda ingin menogol sama ada elemen termasuk kelas CSS, kami boleh menggunakan kaedah .toggleClass().

$(selector).toggleClass(classname);
Salin selepas log masuk

Jika elemen mengandungi kelas CSS yang ditentukan, kelas akan dialih keluar daripada elemen. Jika kelas CSS yang ditentukan tidak terkandung dalam elemen, kelas akan ditambahkan pada elemen.

Sebagai contoh, kod berikut akan menukar sama ada elemen dengan id "myDiv" mengandungi kelas CSS bernama "selected":

$('#myDiv').toggleClass('selected');
Salin selepas log masuk

Di atas adalah kaedah berkaitan gaya utama, melalui mereka, Kita boleh mengubah gaya elemen secara fleksibel. Lebih banyak kaedah jQuery juga boleh dilihat dalam dokumentasi rasmi.

Atas ialah kandungan terperinci jquery menukar gaya elemen. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan