Guarde todas las propiedades css del elemento usando jquery

Question

Básicamente estoy tratando de guardar todas las propiedades CSS actuales de un elemento en un var/array local. Traté:

el.css(); 

y

el.css("*"); 

sin suerte.

¿Hay alguna sugerencia rápida para hacerlo?

Answer 1

• demo:http://so.devilmaycode.it/save-all-css-properties-of-element-using-jquery

He actualizado la respuesta a ser más eficiente que también proporciona un trabajo demo ...

$(function() { 
     // element tag example p and element id 
     function get_element_style(element, id){ 
      var css = {}; 
      $('<iframe id="get-style-'+id+'" style="display:none"/>').appendTo('body'); 
      $('#get-style-'+id).contents().find('body').append('</'+element+'>'); 
      $el = $('#get-style-'+id).contents().find('body').find(element); 
      var defaults_css = $el.getStyles(); 
      $('#get-style-'+id).remove(); 
      var element_css = $('#'+id).getStyles(); 
      for (var i in element_css) { 
       if (element_css[i] !== defaults_css[i]) { 
        css[i] = element_css[i]; 
       } 
      } 
      return css; 
     } 

     var properties = get_element_style('p', 'test-p'); 

    }); 

El problema cuando se obtiene el estilo de un elemento es que no se obtiene solo el valor establecido sino también los valores predeterminados. con este código, estoy tratando de obtener solo los valores establecidos de un elemento. este trabajo tanto con inline estilo, así como con <style> y <link>

• NOTA: esta solución requiere el uso de este plugin https://github.com/moagrius/copycss