通过javascript删除/重置css属性的正确方法是什么？

Question

  

可能重复：
  how to remove css property using javascript?

我有这个javascript：

var div = document.getElementById('myDiv');
div.style.width = '300px';
div.style.height = '200px';
...

依旧......

后来，我面临着删除财产的需要 （不改变它的价值，真正删除意义：就像我之前没有设定的那样）

我写了这样的代码：

1. div.style.height = undefined;
2. div.style.height = null;
3. div.style.height ='';

只有解决方案n.3似乎可以工作，但即便如此......我不确定这是否正确（我只使用chrome来测试）

有人知道什么是正确的方法吗？哪个适用于所有适当的浏览器？

由于

Answer 1

您可以使用inherit或initial值。 http://www.w3.org/TR/css3-values/#common-keywords

Answer 2

你走了：

div.style.height = "auto"

Answer 3

没有＆＃34;正确的方式＆＃34;。微软曾经发明过style.removeAttribute（），但它不受支持。最好的方法是将其设置为标准值。

编辑：如上所述，将其设置为＆＃34;＆＃34;在所有浏览器中重置它，这将是最好的方式。

Answer 4

我刚刚用以下代码创建了一个小提琴

HTML

 <div id="foo" style="height: 100px;"></div>

CSS

#foo {
    height: 200px;
    background-color: yellow;   
}

的JavaScript

var el = document.getElementById("foo");
el.style.height = "auto";

将属性设置为auto实际上将元素上的style属性设置为

<div id="foo" style="height: auto;"></div>

并覆盖应用于#foo的css height属性。要重置样式，如其他人所述，将元素的样式属性设置为空字符串

el.style.height = "";

小提琴here

Answer 5

好吧，另一种选择可能是使用getComputedStyle获取当前样式属性，并在需要重置变量时调用该值。

var style = getComputedStyle(div);

div.origWidth = style. getPropertyValue("width");
div.origHeight = style. getPropertyValue("height");

https://developer.mozilla.org/en-US/docs/DOM/window.getComputedStyle

Answer 6

我将使用文档中的removeAttribute（）函数

document.getElementById("myDiv").removeAttribute("height")