Jak usunąć atrybut CSS elementu za pomocą jQuery?

94

Jeśli ustawię wartość CSS na określonym elemencie za pomocą:

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

Chcę mieć możliwość anulowania tej wartości specyficznej dla elementu i użycia wartości kaskadowej, na wzór:

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

Ale ta składnia wydaje się nie działać - czy jest to możliwe przy użyciu innej składni?

Edycja: wartość nie jest dziedziczona z elementu nadrzędnego - oryginalne wartości pochodzą z selektora na poziomie elementu. Przepraszamy za zamieszanie!

jquery css

— cdleary
źródło

142

Z dokumentacji jQuery :

Ustawienie wartości właściwości style na pusty ciąg - np. $('#mydiv').css('color', '')- usuwa tę właściwość z elementu, jeśli została już bezpośrednio zastosowana, czy to w atrybucie stylu HTML, za pomocą .css()metody jQuery , czy poprzez bezpośrednie manipulowanie stylewłaściwością DOM . Nie usuwa jednak stylu, który został zastosowany za pomocą reguły CSS w arkuszu stylów lub <style>elemencie.

— Glenn Moss
źródło

Natknąłem się na to pytanie, kiedy miałem ten problem. W moim przypadku ustawiałem atrybut css w styleatrybucie na tagu, więc ta metoda nie zadziałała. Zastosowanie stylu .css()metodą zamiast w tagu pozwoliło mi go później usunąć.

— Glenn Moss,

14

Myślę, że możesz też:

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

To właśnie robiłem dawno temu dla displaywłaściwości w zwykłym starym javascript, aby pokazać / ukryć pole.

— FryGuy
źródło

4

Właściwie składnia, o której myślałem, że jest nieprawidłowa (z null), wydaje się działać - mój selektor został po prostu nieprawidłowo uformowany, a zatem nie zawierał żadnych elementów. D'oh!

— cdleary
źródło

21

Od wersji jquery 1.4.3 css(..., null)nie działa i css(..., '')powinno być używane zamiast tego - bugs.jquery.com/ticket/7233

— Tim Sylvester

3

Spróbuj tego:

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

— HectorMac
źródło

1

Dziedziczenie niestety nie jest zachowaniem, którego szukam: „właściwość przyjmuje taką samą wartość obliczoną jak właściwość elementu nadrzędnego elementu” z w3.org/TR/CSS2/cascade.html

— cdleary

Bardziej prawdopodobne jest „początkowe” niż „dziedziczenie”. „Dziedzicz” dostosowuje się do rodzica, „Inicjał” robi to, co mówi słowo.

— Chris S.,

0

Bo to jest warte, wydaje się, że nie działa w IE 8 dla `` filtra '', musiałem użyć tego (w funkcji zwrotnej fadeIn):

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

Oczywiście musiałem usunąć pustą deklarację filtra wbudowanego, aby CSS mógł zacząć działać; istniały inne reguły wbudowane, więc nie mogłem po prostu usunąć atrybutu stylu.

— Brandon Hill
źródło

-2

Jeśli to może pomóc, dodaję problem z podwójnym cudzysłowem:

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

nie działa podczas

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

Pracuje

— merlintintin
źródło