如何删除使用.css（）函数添加的样式？

我正在使用jQuery更改CSS，并且希望删除基于输入值添加的样式：

if(color != '000000') $("body").css("background-color", color); else // remove style ?

我怎样才能做到这一点？
请注意，只要使用颜色选择器选择了颜色（即，当鼠标移至色轮上时），以上行就会运行。

第二注：我不能这样做，css("background-color", "none")因为它将从CSS文件中删除默认样式。
我只想删除jQuerybackground-color添加的内联样式。

将属性更改为空字符串似乎可以完成此工作：

$.css("background-color", "");

可接受的答案有效，但是style在我的测试中DOM上留有空属性。没什么大不了的，但是这消除了这一切：

removeAttr( 'style' );

假定您要删除所有动态样式并返回样式表样式。

有几种使用jQuery删除CSS属性的方法：

1.将CSS属性设置为其默认（初始）值

.css("background-color", "transparent")

请参阅MDN的CSS属性的初始值。此处的默认值为transparent。您还可以使用inherit多个CSS属性从其父级继承属性。在CSS3 / CSS4中，您也可以使用initial，revert或者unset这些关键字可能对浏览器的支持有限。

2.删除CSS属性

空字符串将删除CSS属性，即

.css("background-color","")

但是要注意，如jQuery .css（）文档中所指定的那样，这会删除该属性，但是它对某些CSS速记属性（包括background）与IE8存在兼容性问题。

将样式属性的值设置为空字符串，例如$（'＃mydiv'）。css（'color'，''）-如果该属性已被直接应用（无论是HTML样式），则会从元素中删除该属性属性，通过jQuery的.css（）方法或通过对style属性的直接DOM操作。但是，它不会删除样式表或元素中已应用CSS规则的样式。警告：一个值得注意的例外是，对于IE 8及更低版本，删除快捷方式属性（例如border或background）将完全从元素中删除该样式，而不管样式表或element中的设置是什么。

3.删除元素的整个样式

.removeAttr("style")

我有办法使用纯JavaScript删除样式属性，只是让您知道纯JavaScript的方法

var bodyStyle = document.body.style;
if (bodyStyle.removeAttribute)
    bodyStyle.removeAttribute('background-color');
else        
    bodyStyle.removeProperty('background-color');

这将删除完整的标签：

  $("body").removeAttr("style");

这些jQuery函数中的任何一个都应该起作用：

$("#element").removeAttr("style");
$("#element").removeAttr("background-color") 

只需使用：

$('.tag-class').removeAttr('style');

要么

$('#tag-id').removeAttr('style');

怎么样：

var myCss = $(element).attr('css');
myCss = myCss.replace('background-color: '+$(element).css('background-color')+';', '');
if(myCss == '') {
  $(element).removeAttr('css');
} else {
  $(element).attr('css', myCss);
}

使用我的插件：

$.fn.removeCss=function(all){
        if(all===true){
            $(this).removeAttr('class');
        }
        return $(this).removeAttr('style')
    }

对于您的情况，请按以下方式使用：

$(<mySelector>).removeCss();

要么

$(<mySelector>).removeCss(false);

如果您还想删除其类中定义的CSS：

$(<mySelector>).removeCss(true);

尝试这个：

$('#divID').css({"background":"none"});// remove existing

$('#divID').css({"background":"#bada55"});// add new color here.

谢谢

如果使用CSS样式，则可以使用：

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

然后替换为：

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

如果您不使用CSS样式，并且在HTML元素中具有属性，则可以使用：

$("#element").attr("style.background-color",color);

2018年

有本机API

element.style.removeProperty(propery)

这个也可以！！

$elem.attr('style','');

为什么不采用您希望删除CSS类的样式？现在您可以使用：.removeClass()。这也开辟了使用以下方法的可能性：.toggleClass()

（如果存在该类，则将其删除；如果不存在，则将其添加。）

在处理布局问题时，添加/删除类也不会造成更改/故障排除的混乱（相对于试图弄清为什么特定样式消失的原因）。

let el = document.querySelector(element)
let styles = el.getAttribute('style')

el.setAttribute('style', styles.replace('width: 100%', ''))

这比其他一些解决方案更为复杂，但在以下情况下可能会提供更大的灵活性：

1）制作一个类定义，以隔离（封装）您要有选择地应用/删除的样式。它可以为空（在这种情况下，可能应该是）：

.myColor {}

2）使用这个代码，基于http://jsfiddle.net/kdp5V/167/从这个答案 由gilly3：

function changeCSSRule(styleSelector,property,value) {
    for (var ssIdx = 0; ssIdx < document.styleSheets.length; ssIdx++) {
        var ss = document.styleSheets[ssIdx];
        var rules = ss.cssRules || ss.rules;
        if(rules){
            for (var ruleIdx = 0; ruleIdx < rules.length; ruleIdx++) {
                var rule = rules[ruleIdx];
                if (rule.selectorText == styleSelector) {
                    if(typeof value == 'undefined' || !value){
                        rule.style.removeProperty(property);
                    } else {
                        rule.style.setProperty(property,value);
                    }
                    return; // stops at FIRST occurrence of this styleSelector
                }
            }
        }
    }
}

用法示例：http：//jsfiddle.net/qvkwhtow/

注意事项：

• 未经广泛测试。
• 不能在新值中包含！important或其他指令。任何此类现有指令都将通过此操作丢失。
• 仅更改第一次发现的styleSelector。不会添加或删除整个样式，但是可以通过更精细的操作来完成。
• 任何无效/不可用的值将被忽略或引发错误。
• 在Chrome中（至少），非本地（如跨站点）的CSS规则不会通过document.styleSheets对象公开，因此无法在它们上使用。记住此代码的“首次发现”行为，必须添加一个局部替代并对其进行操作。
• 一般来说，document.styleSheets对操作不是特别友好，不要指望它能积极地使用。

通过这种方式隔离样式是CSS的全部目的，即使并非如此。操纵CSS规则并不是jQuery的全部目的，jQuery操纵DOM元素，并使用CSS选择器来做到这一点。

简单在Web开发中很便宜。我建议在删除特定样式时使用空字符串

$(element).style.attr = '  ';

尝试这个

$(".ClassName").css('color','');
Or 
$("#Idname").css('color','');