jquery padam css

jQuery ialah salah satu rangka kerja pembangunan bahagian hadapan yang paling biasa digunakan hari ini Ia memberikan kemudahan dan kecekapan yang hebat untuk pembangunan web kami, membolehkan kami melengkapkan beberapa kesan halaman biasa dan animasi interaktif dengan lebih cepat. Dalam pembangunan sebenar, kita biasanya perlu mengubah suai beberapa elemen DOM, dan salah satu operasi biasa ialah memadamkan gaya CSS elemen tersebut. Artikel ini akan meneroka cara mengalih keluar gaya CSS daripada elemen dengan jQuery.

Kaedah CSS() JQuery

Dalam jQuery, cara untuk mengubah suai gaya CSS elemen biasanya menggunakan kaedah CSS() Kaedah ini ialah kaedah objek jQuery. yang membolehkan kami melakukannya sekaligus Ubah suai atau dapatkan satu atau lebih sifat CSS. Berikut ialah sintaks kaedah CSS():

$(selector).css(property,function(index,currentvalue){})

Antaranya, sifat parameter ialah nama sifat CSS, yang boleh menjadi rentetan atau objek, digunakan untuk tetapkan atau dapatkan gaya CSS. Jika kita ingin menetapkan berbilang sifat CSS pada masa yang sama, kita boleh memasukkan objek, contohnya:

$('.my-element').css({
  'background-color': 'red',
  'color': 'white',
  'font-size': '20px'
});

Contoh ini menetapkan warna latar belakang elemen .my-element kepada merah, warna fon kepada putih , dan saiz fon kepada 20px. Jika kita hanya perlu mendapatkan sifat CSS tertentu bagi elemen ini, kita boleh menghantar rentetan sebagai parameter sifat, contohnya:

var bgColor = $('.my-element').css('background-color');

Contoh ini akan mendapat nilai warna latar belakang elemen .my-element dan simpannya dalam pembolehubah bgColor.

Gunakan kaedah CSS() untuk memadam gaya elemen

Kita boleh menggunakan kaedah CSS() untuk menetapkan atau mendapatkan gaya CSS elemen, tetapi bagaimana jika kita perlu padam gaya elemen tertentu Apa yang perlu dilakukan? Pada masa ini, kita boleh memadamkan gaya elemen tertentu dengan menghantar rentetan null atau kosong dalam kaedah CSS(). Contohnya, jika kita ingin memadamkan gaya warna latar belakang elemen .my-element, kita boleh menulis:

$('.my-element').css('background-color', '');

Ini akan memadamkan gaya warna latar belakang elemen .my-element. Sudah tentu, kita juga boleh memadamkan berbilang gaya dengan menghantar objek, contohnya:

$('.my-element').css({
  'background-color': '',
  'color': '',
  'font-size': ''
});

Ini akan memadamkan semua warna latar belakang, warna fon dan gaya saiz fon bagi elemen .my-element.

Dalam pembangunan sebenar, jika kita ingin memadam gaya yang ditentukan bagi sesuatu elemen, kita boleh menggunakan kaedah di atas, dan kita juga boleh merangkumnya ke dalam fungsi, yang mudah untuk kita panggil beberapa kali dalam kod. Berikut ialah contoh kod:

function removeStyle(selector, property) {
  $(selector).css(property, '');
}

Melalui fungsi ini, kita boleh memanggil kod berikut dalam kod untuk memadamkan gaya warna latar belakang elemen:

removeStyle('.my-element', 'background-color');

Ringkasan

Dalam jQuery , kita boleh menggunakan kaedah CSS() untuk mengubah suai gaya CSS elemen dan memadamkan gaya tertentu elemen dengan menghantar nol atau rentetan kosong. Walaupun dalam projek sebenar kita biasanya menggunakan kaedah ganti gaya untuk mengubah suai gaya elemen, kaedah ini masih sangat berguna apabila kita perlu memadamkan gaya elemen. Ia memberikan kita cara yang mudah dan berkesan untuk memanipulasi sifat gaya elemen.

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