如何在Chrome中删除以编程方式添加的样式？

Question

我有一个带有两个按钮的简单段落，分别对其进行着色并删除颜色。 颜色删除适用于Firefox，但不适用于Chrome（准确地说是铬浏览器）。 如果我要通过样式属性（ <p id="paragraph" style="color: #f00;"> ）而不是以编程方式添加样式（ $('#paragraph').css('color', '#f00');或document.getElementById('paragraph').style.color="#f00"; ），然后颜色删除将适用于两个浏览器。 不幸的是，这在我的现实世界中是不可能的。 我怎么能做这个工作？

代码如下所示：

HTML

<p id="paragraph">TARGET</p>
<input type="button" value="Style me" onclick="styleIt();" />
<input type="button" value="Strip styles" onclick="stripStyles();" />

JavaScript的

function styleIt()
{
    $('#paragraph').css('color', '#f00');
}

function stripStyles()
{
    $('#paragraph').removeAttr("style");
}

jsFiddle ： http ： //jsfiddle.net/qBtYW/10/

PS我很确定问题在于removeAttr在不同浏览器中的行为方式，但我可能错了。

编辑我意识到我可以使用css（'颜色'，''），但我正在寻找能够删除所有样式的东西，即使那些我不知道的那些......

Answer 1

您可以将style属性设置为等于空字符串：

function stripStyles()
{
  $('#paragraph').attr('style', "");
}

我不确定为什么removeAttr有问题，但我认为这应该适用于所有浏览器。