Сохраните все свойства css элемента, используя jquery

Question

Я в основном пытаюсь сохранить все текущие свойства CSS элемента в локальном var / array. Я попробовал:

el.css();

и

el.css("*");

Без удачи.

Есть ли быстрый совет, чтобы сделать так?

Answer 1

• демо: http://so.lucafilosofi.com/save-all-css-properties-of-element-using-jquery

Я обновил ответ, чтобы повысить его эффективность и предоставить рабочую демонстрацию ...

    $(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');

    });

проблема при получении стиля элемента заключается в том, что вы получаете не только установленное значение, но и значения по умолчанию. с помощью этого кода я пытаюсь получить только установленные значения элемента. эта работа как в стиле inline, так и в <style> и <link>

• ПРИМЕЧАНИЕ: это решение требует использования этого плагина https://github.com/moagrius/copycss

Answer 2

Вы имеете в виду:

el.attr('style');

Также это может вас заинтересовать:

Как получить список всех атрибутов css элемента с помощью jQuery?