Jak usunąć z elementu wszystkie odziedziczone i obliczone style?

Question

strona ma następujący CSS:

input[type=text] 
{ 
    display: inline; padding: 7px; background-color: #f6f6f6; font-size: 12px; letter-spacing: 1px; border: 1px solid #aac7d1; 
    /* lots of other styles here... */ 
} 

Mam wiele elementów tekstu wejściowego i następujący:

<input type="text" id="txt1" /> 

i staram się stosować różne style do tego indywidualnego tekstowym (txt1) za pomocą jQuery :

$('#txt1').removeClass().removeAttr('style').css({ 
    'background-color': '#ff0000', 
    //lots of other styles here... 
}); 

Ale te style, które pochodzą z arkusza stylów, nie mogą zostać usunięte z elementu w ten sposób. Reguła css, input[type=text] nie jest klasą niestandardową, więc removeClass() nie działa tutaj, jeśli mam rację.

Co chcę zrobić; aby całkowicie usunąć wszystkie style kiedykolwiek zastosowane do elementu txt1. Czy jest jakiś sposób na zrobienie tego innego niż uzyskanie listy wszystkich stylów obliczeniowych i ustawienie ich pustych?

Answer 1

Czy istnieje pewien sposób to zrobić

Nie ma sposobu, aby zatrzymać zasady mające zastosowanie do elementu, jeśli meczów selektora.

Można

• zestaw każda nieruchomość chcesz mieć konkretną wartość (z odpowiednio konkretnego selektora i !important
• przesunąć element do innego dokumentu (który może być następnie załadowany, na Przykładowo, iframe).
• usunąć regułę (a tym samym spowodować, że nie stosuje się do każdy element)
• zmienić selektor na zestawie reguł (tak, to nie pasuje do elementu dłużej, Y ou trzeba uważać, aby upewnić się, że nadal wybiera elementy, które dbają o)

inne niż uzyskanie listy wszystkich obliczonych stylów i ustawiając je pusty?

To by nie działało. Większość właściwości nie przyjmuje pustej wartości, więc reguła byłaby niepoprawna i zignorowana (co spowodowałoby, że poprzednia reguła zostanie zastosowana ponownie).

Answer 2

Jak widać pod tym linkiem: http://www.w3.org/TR/CSS2/cascade.html#specificity, wszystkie selektory mają wartość specyficzności. Tak więc, jeśli napiszesz taką regułę css: #txt1 {}, możesz zresetować wszystkie niepotrzebne wartości.