如何从元素中删除所有继承和计算的样式？ [英] How to remove all inherited and computed styles from an element?

问题描述

此页面包含以下CSS：

The page has the following 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... */
}

我有许多文本输入元素和以下：

I have many text-input elements and the following:

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

我尝试通过jQuery为这个单独的文本框（txt1）应用不同的样式：

And I try to apply different styles to this individual textbox (txt1) via jQuery:

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

但是样式表中的那些样式不能像这样从元素中删除。 css规则 input [type = text] 不是一个自定义类，所以 removeClass（）如果我是对的。

But those styles that come from the style-sheet cannot be removed from the element this way. The css rule, input[type=text] is not a custom class so removeClass() does not work here, if I'm right.

我想做的是;以完全删除所有应用于元素 txt1 的样式。除了得到所有计算的样式列表并将它们设置为空以外，是否有一定的方法？

What I want to do is; to completely remove all styles ever applied to the element txt1. Is there a certain way to do this other than getting the list of all computed styles and setting them empty?

推荐答案

是否有某种方法可以执行此操作

Is there a certain way to do this

如果选择器匹配，则无法停止应用于元素的规则

There is no way to stop rules applying to an element if the selector matches.

您可以

• 设置每个要拥有特定值（使用适当的特定选择器和！important


• 将元素移动到其他文档




• 删除规则（因此不适用于更改规则集上的选择器（因此不再匹配元素，您必须小心确保仍然选择您关心的元素）

• set every property you want to have a specific value (with a suitably specific selector and !important
• move the element to a different document (which could then be loaded with, for example, an iframe).
• remove the rule (and thus cause it to not apply to any element)
• change the selector on the ruleset (so it doesn't match the element any more, you have to be careful to make sure it still selects elements you care about)

除了获取所有计算的样式列表并将它们设置为空以外吗？

other than getting the list of all computed styles and setting them empty?

这不会工作。大多数属性不接受空白值，因此规则将无效并被忽略（从而导致之前的规则再次应用）。

That wouldn't work. Most properties won't accept a blank value, so the rule would be invalid and ignored (thus causing the previous rule to apply again).

这篇关于如何从元素中删除所有继承和计算的样式？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！