Javascript：保存和恢复在IE中不工作的样式状态？

假设我们存储的样式如下所示：

var  CSSobject = obj;
var  origStyle = getComputedStyle(obj);

…然后我们执行许多操作来操纵和更改对象的样式。完成更改后，我们最终会执行以下操作以恢复更改前的样式状态：

CSSobject.style = origStyle;

上述技术适用于Chrome和Firefox，但我注意到它在Edge 25.10或Explorer中不起作用。（注意：目标是将任意状态恢复到自身状态，而不是恢复默认状态）

这是一个简单的解决方案吗？还是一罐虫子

---

另外，我不喜欢Jquery（不使用它）。目前最好使用纯Javascript解决方案。谢谢

如果您以内联方式进行所有更改，我建议存储

样式

属性，而不是整个计算样式。这样会更有效率

编辑

这在IE和EDGE中对我很有用

var CSSobject = $("h1")[0];
var origStyle = window.getComputedStyle(CSSobject); //,null); passing null is optional or you can pass the pseudo element of which you want the properties of 
var switchStyle = function(to) {
  for (p in origStyle) {
    to.style[p] = origStyle[p];
  }
};
switchStyle($("span")[0])

---

我不确定，但您可以在对象上快照当前样式，如下代码所示。这只是一个好主意。（参考）

/*快照UTIL*/
（功能（）{
var stylesToSnapshot=[“转换”，“-webkit转换”]；
$.fn.snapshotStyles=函数（）{
if（window.getComputedStyle）{
$（此）。每个（函数（）{
对于（var i=0；i

如果能看到一个工作页面以及您正面临的问题，那将是一件有趣的事情。由于在所有浏览器中都可以工作，我只能假设您的问题源于将计算值指定给元素的样式

我必须说，仅仅将样式指定给对象并不能恢复对象的状态，它只是试图强制它。例如，一个CSS规则！重要提示：您甚至可以覆盖内联样式规则。计算样式中的值是根据CSS和窗口状态（例如，宽度）计算的。例如，在样式中设置了该值，元素现在被冻结，对窗口大小的更改没有响应

---

我的建议是为您的实际问题找到一个更难实现但更有效的解决方案，而不是使用getComputedStyle。例如，使用样式值更有意义。

我能说什么，这是可能的，但你可以用不同的方式来做

你无法通过你尝试的方式直接存储和恢复样式

你所能做的就是在的帮助下，将页面中的所有样式（默认样式）一个接一个地存储在JS对象中-

var defaultStyle;
defaultStyle.background_color = [];
defaultStyle.background_color.p_classSelected = $("p.class_selected").css("background-color");

此示例仅针对一个元素，您应该针对在运行时更改的每个样式执行此操作

然后，您应该创建一个函数，用这种方式从JS文件中存储的值恢复样式-

$("p.class_selected").css("propertyname",defaultStyle.background_color.p_classSelected);

这应该在您在运行时更改样式的每个元素上完成

更多信息请参见和

---

更新- 您还可以将您的设计存储在中，从中恢复设计

更多信息请参见

---

---

我想你有你的答案：）。

好吧，这比我想象的要容易得多（特别是在我的例子中，我根本不使用内联样式；它都是外部CSS）

任何时候Javascript都会通过

.style

选择器赋值，它实际上是在创建一个内部样式并赋值给它

---

我所要做的就是将样式设置为null，然后重新读取外部CSS，就好像什么都没发生一样

el.style=null

。。。为了使它更健壮一点（在关闭更改中，存在一些较小的内部样式设置），我可以事先将其保存为

var origInlineStyle=el.style.cssText

，然后执行

el.style.cssText=origInlineStyle

问题是更改可能非常广泛，并且经常会影响多个伪元素。它是一种皇家的伪元素。我的作业做得很好。。但IE除外。检查我的编辑@ThomasAnLets说我们有一个具有边框颜色过渡效果的元素。在某个时刻，Javascript会更改边框颜色，过渡效果会被屏蔽（失去优先级）。。。我们如何将零钱退回。指定边框颜色仍然是一种指定。有没有取消赋值的方法？如果Javascript更改了样式，那么它会在样式对象中设置或取消设置一些值。如果您恢复样式对象（到Javascript将样式更改为的所有元素），您应该得到与Javascript更改之前完全相同的情况。您没有设置单个属性，您只是覆盖整个样式对象。这就是问题所在。如何恢复。覆盖样式对象本身（我认为简单的赋值就可以了）。它应该这样做。使用其原始样式对象，而不是getComputedStyle。如果它不起作用，请创建一个JSFIDLE，这样我们就可以看到问题所在。好的，我的页面中从来没有内联样式（都是CSS外部样式表）。因此，每次Javascript使用.style选择器时，似乎都会将值分配给它内联附加的临时样式元素。我想一个想法是创建一个空样式的对象，并将其分配给元素，从而有效地删除所有javascript更改，从而充当恢复机制。。。我会试试这个，看看它是否有效，或者

$("p.class_selected").css("propertyname",defaultStyle.background_color.p_classSelected);