qual è il modo corretto di rimuovere/ripristinare una proprietà css tramite javascript?

Question

Eventuali duplicati:
how to remove css property using javascript?

ho questo javascript:

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

e così via ...

Più tardi mi trovo di fronte alla necessità di rimuovere una proprietà (non cha nging il suo valore, la rimozione davvero significato: come se io non avevo impostato prima)

ho codificato qualcosa di simile:

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

Solo soluzione n.3 sembra funzionare ma anche così ... io non sono sicuro che questo è il modo corretto per farlo (Io uso solo Chrome per testare questa)

Qualcuno sa che cosa c'è nel modo corretto? che funziona su tutti i browser corretti?

Grazie

Answer 1

Non c'è "modo corretto". Una volta Microsoft ha inventato style.removeAttribute(), ma non è supportato. Il modo migliore è impostarlo sul valore standard.

Modifica: Come descritto da "Dystroy", impostandolo su "" lo reimposta in tutti i browser, in modo che sarebbe il modo migliore.

Answer 2

qui si va:

div.style.height = "auto" 

Answer 3

userei la funzione removeAttribute() dal documento

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

Answer 4

Bene, un'altra opzione potrebbe essere quella di utilizzare getComputedStyle per ottenere la proprietà di stile corrente e richiamare quel valore quando è necessario ripristinare una variabile.

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 5

È possibile utilizzare inherit o initial valore.http://www.w3.org/TR/css3-values/#common-keywords

Answer 6

Ho appena creato un violino con il seguente codice

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"; 

L'impostazione della proprietà per Auto imposta in realtà l'attributo style sull'elemento da

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

e sostituisce la proprietà height css applicato a #foo. Per ripristinare uno stile, come detto da altri impostare la proprietà style dell'elemento su una stringa vuota

el.style.height = ""; 

Fiddle here