Bagaimana cara menghapus atribut CSS elemen menggunakan jQuery?

93

Jika saya menetapkan nilai CSS pada elemen tertentu menggunakan:

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

Saya ingin dapat menghapus nilai khusus elemen tersebut dan menggunakan nilai berjenjang, di sepanjang baris:

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

Tetapi sintaks itu sepertinya tidak berfungsi - apakah ini mungkin menggunakan sintaks lain?

Edit: Nilai tidak diwarisi dari elemen induk - nilai asli berasal dari pemilih tingkat elemen. Maaf atas kebingungan apa pun!

jquery css

— cdleary
sumber

141

Dari dokumen jQuery :

Menyetel nilai properti gaya ke string kosong - misalnya $('#mydiv').css('color', '')- menghapus properti itu dari elemen jika sudah diterapkan secara langsung, baik dalam atribut gaya HTML, melalui .css()metode jQuery , atau melalui manipulasi DOM langsung dari styleproperti tersebut. Namun, ini tidak menghapus gaya yang telah diterapkan dengan aturan CSS di lembar gaya atau <style>elemen.

— Glenn Moss
sumber

Saya menemukan pertanyaan ini ketika saya mengalami masalah ini. Dalam kasus saya, saya mengatur atribut css di styleatribut pada tag, jadi metode ini tidak berfungsi. Menerapkan gaya dengan .css()metode alih-alih di tag memungkinkan saya untuk menghapusnya nanti.

— Glenn Moss

14

Saya rasa Anda juga bisa melakukan:

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

Itulah yang biasa saya lakukan sejak lama untuk displayproperti di javascript biasa-lama untuk menampilkan / menyembunyikan bidang.

— FryGuy
sumber

4

Sebenarnya, sintaks yang saya pikir salah (dengan null) tampaknya berfungsi - pemilih saya hanya dibentuk dengan tidak benar, dan karenanya tidak menghasilkan elemen. D'oh!

— cdleary
sumber

21

Pada jquery 1.4.3 css(..., null)tidak berfungsi dan css(..., '')harus digunakan sebagai gantinya - bugs.jquery.com/ticket/7233

— Tim Sylvester

3

Coba ini:

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

— HectorMac
sumber

1

Mewarisi sayangnya bukan perilaku Saya mencari: "properti mengambil nilai yang dihitung sama dengan properti untuk induk elemen" dari w3.org/TR/CSS2/cascade.html

— cdleary

Lebih mungkin 'awal' daripada 'mewarisi'. 'Mewarisi' menyesuaikan dari induk, 'Inisial' melakukan apa yang dikatakan kata tersebut.

— Chris S.

0

Untuk apa nilainya ini tampaknya tidak berfungsi di IE 8 untuk 'filter', saya harus menggunakan ini (dalam panggilan balik fadeIn):

$(this).attr('style', $(this).attr('style').replace(/\bfilter:\s*;*/, ''));

Jelas, saya harus menghapus deklarasi filter sebaris yang kosong sehingga CSS dapat diterapkan; ada aturan sebaris lainnya jadi saya tidak bisa begitu saja menghapus atribut gaya.

— Brandon Hill
sumber

-2

Jika bisa membantu, saya menambahkan masalah dengan kutipan ganda:

$('#element').css("border-color", "");

tidak bekerja saat

$('#element').css('border-color', '');

bekerja

— merlintintin
sumber