Как удалить все унаследованные и вычисленные стили из элемента?

Question

Страница имеет следующий 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... */
}

У меня есть много элементов ввода текста и следующее:

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

И я пытаюсь применить различные стили к этому отдельному текстовому полю (txt1) через jQuery:

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

Но те стили, которые взяты из таблицы стилей, не могут быть удалены из элемента таким способом. Правило css, input[type=text] не является пользовательским классом, поэтому removeClass() здесь не работает, если я прав.

То, что я хочу сделать, это; полностью удалить все стили, когда-либо примененные к элементу txt1. Есть ли определенный способ сделать это, кроме получения списка всех вычисляемых стилей и установки их пустыми?

Answer 1

Есть ли определенный способ сделать это

Нет способа остановить применение правил к элементу, если селектор совпадает.

Вы можете либо

• установить каждое свойство, которое вы хотите иметь определенное значение (с соответствующим определенным селектором и !important
• переместить элемент в другой документ (который затем можно загрузить, например, с помощью iframe).
• удалить правило (и, следовательно, сделать его неприменимым к любому элементу)
• изменить селектор в наборе правил (чтобы он больше не соответствовал элементу, нужно быть осторожным, чтобы убедиться, что он по-прежнему выбирает интересующие вас элементы)

кроме получения списка всех вычисляемых стилей и установки их пустыми?

Это не сработает. Большинство свойств не принимают пустое значение, поэтому правило будет недействительным и будет игнорироваться (что приведет к повторному применению предыдущего правила).

Answer 2

Как видно по этой ссылке: http://www.w3.org/TR/CSS2/cascade.html#specificity, все селекторы имеют значение специфичности.Итак, если вы напишите такое правило css: #txt1 {}, вы можете сбросить все ненужные значения.