用jQuery重置元素样式

有谁知道如何用jQuery重置元素的样式？举例来说，我有这样一个样式表：用jQuery重置元素样式

.container-red { background-color: #f00; } 
.container-red #innerbox { background-color: #fff; } 
.container-white { background-color: #fff; } 
.container-white #innerbox { background-color: #f00; } 
#innerbox { margin: 20px; }

而这个标记：

<div id="container" class="container-red"> 
    <div id="innerbox">Some text here</div> 
</div>

然后当我改变使用jQuery

$("#container").removeClass("container-red").addClass("container-white");

的内盒个数造型不会改变对类因为它已经被风格化了，这让我留下了一个白色的容器和一个白色的内盒，而不是一个白色的容器和一个红色的内盒。因此，我希望能够像做

$("#container").children().resetStyles();

，并让每个容器的孩子更新到正确的造型

编辑：对不起，你没事吧，代码确实做工精细，我的问题只是我有一些其他的CSS覆盖我的类风格。

来源

2011-08-31 Jordan Wallwork

这不是它应该做的吗？ http://jsfiddle.net/cYARr/你的代码似乎在这里工作得很好。 –

你正在做的事情错了，我想是因为我测试了它，并给我它的工作原理：

http://jsfiddle.net/VH4du/

我测试浏览器，Firefox和IE9。

来源

2011-08-31 11:05:50

它确实改变了我。看一个例子here。

来源

2011-08-31 11:06:46

问题不在于你的jQuery代码，也不是说这个元素已经有了风格。任何体面的和最近的浏览器都会自动重新应用样式到内部元素。

问题是，您使用内部框作为ID：因为应该只有一个元素与一个ID，一些浏览器的CSS引擎给出奇怪的优先级，并可能绕过一些CSS规则。

尝试将innerbox转换为CLASS，并且它应该按照您的预期工作。

顺便说一句，哪个浏览器暴露了问题？

来源

2011-08-31 11:07:04

他发布的HTML标记中没有重复的标识。 –

不，我没有说过存在重复的id，简单地说，考虑到id的单一性，一些CSS引擎倾向于在涉及id时优化并忽略CSS规则的一部分。使用类是更加友好的CSS引擎。 –

啊，我的坏，我没有这样理解（可能是因为你在括号里写的）。 –

用jQuery重置元素样式

回答

相关问题