Obtener todos los estilos CSS para un elemento DOM (a la Firebug)

Question

Para un elemento DOM, ¿cómo obtener todos los estilos especificados en CSS para un elemento en particular? ¿Se trata de iterar sobre todos los nombres de estilo css?

¿O hay una manera más elegante? ¿Cómo lo hace Firebug?

Gracias

Answer 1

Para un elemento DOM, cómo me sale todos los estilos especificados en CSS para un elemento en particular ? ¿Es un caso de que itera sobre todos los nombres de estilo css?

Sí, lo es.

¿O hay una manera más elegante?

No sé acerca más elegante (elegancia es bastante alto en la escala subjetiva), pero sin duda sería más corto y más dulce si hizo uso de una biblioteca como jQuery, aquí hay un alguien solución codificada para responder a otra pregunta: ¿

How Can I Get List Of All Element CSS Attributes with jQuery?

¿Cómo Firebug lo hacen?

No tengo ni idea.

Answer 2

Se puede recorrer todos los estilos CSS de un elemento como este:

var myElement = document.getElementById('someId'); 
var myElementStyle = myElement.style; 

for(var i in myElementStyle){ 
    // if it's not a number-index, print it out. 
    if(/^[\d]+/.exec(i) == null){ 
     console.log("Style %s = %s", i, myElementStyle[i]); 
     /* 
     * Do other stuff here... 
     */ 
    } 
}

Answer 3

usted debería ser capaz de hacerlo con getComputedStyle:

var css = window.getComputedStyle(element); 
for (var i=0; i<css.length; i++) { 
    console.log(css[i] +'='+css.getPropertyValue(""+css[i])) 
}