Prototype.js：reset setStyle

Question

有没有办法如何将样式重置回我的CSS中？

示例：

#foo {width: 50px; height: 50px; position: absolute; top: 150px; left: 250px;}


function moveFoo(newpostop, newposleft){
  $('foo').setStyle({top: newpostop+'px', left: newposleft+'px'});
}

现在，当我完成它之后，我想把foo移回原处。我知道它可以是硬编码的，但我需要用25个不同的div来做这个。

由于

Answer 1

使用null - 值设置样式可以解决prototype.js中未设置的问题

因此，您也可以使用$('foo').setStyle({top:null,left:null})还原您所做的更改。

Answer 2

设置样式不会消除CSS类中所有元素。它只会覆盖已更改的那些。控件的实际样式是CSS样式和样式属性上的自定义样式的组合。要完全恢复CSS样式，只需删除样式属性即可。

$('#foo').removeAttr('style');

编辑：

显然上述方法不起作用。我在评论中被告知以下情况：

$('#foo').writeAttr('style', '');

Answer 3

你可以使用普通的Javascript命令，对我来说工作正常：

$('foo').removeAttribute('style');  

将删除整个style =“”元素

Answer 4

您可以删除某个属性，但我认为您无法将其还原。

如果您使用其他样式表来更改布局，则可以还原它。这样你就可以启用样式表来显示更改，并禁用它以撤消它。

最好的解决方案可能是将旧属性存储到数组中，然后使用该数组更改样式属性

这样的事情：

   var tempStyle = new Array();

    function moveFoo(newpostop, newposleft){
      tempStyle ["foo"] = new Array();
      tempStyle ["foo"]["top"] = newpostop;
      tempStyle ["foo"]["left"] = newposleft;

      $('foo').setStyle({top: newpostop+'px', left: newposleft+'px'});
    }

   function restoreFoo(){
      $('foo').setStyle({top: tempStyle ["foo"]["top"]+'px', left: tempStyle ["foo"]["left"]+'px'});
    }