window.getComputedStyle

Résumé

getComputedStyle() donne la  valeur calculée finale de toutes les propriétés CSS sur un élément.

Syntaxe

var style = window.getComputedStyle(element[, pseudoElt]);

element

L’Element pour lequel vous voulez obtenir une valeur calculée.

pseudoElt Facultatif

Chaîne de caractère spécifiant le pseudo-élément à cibler. Doit être null (ou non spécifiée) pour les éléments communs.

La valeur de retour style est un objet CSSStyleDeclaration.

Exemple

var elem1 = document.getElementById("elemId");
var style = window.getComputedStyle(elem1, null);

// Ce qui équivaut à : 
// var style = document.defaultView.getComputedStyle(elem1, null);

<style>
 #elem-container{
   position: absolute;
   left:     100px;
   top:      200px;
   height:   100px;
 }
</style>

<div id="elem-container">dummy</div>
<div id="output"></div>  

<script>
  function getTheStyle(){
    var elem = document.getElementById("elem-container");
    var theCSSprop = window.getComputedStyle(elem,null).getPropertyValue("height");
    document.getElementById("output").innerHTML = theCSSprop;
   }
  getTheStyle();
</script>