Удалить CSS из Div, используя JQuery

Question

Я новичок в JQuery. В моем приложении у меня есть следующее:

$("#displayPanel div").live("click", function(){
  $(this).css({'background-color' : 'pink', 'font-weight' : 'bolder'});
});

Когда я нажимаю на Div, цвет этого Div изменяется. В рамках этой функции Click у меня есть некоторые функции, которые нужно сделать. После всего этого я хочу удалить примененный Css из Div. Как я могу сделать это в JQuery?

Answer 1

Если вы не хотите использовать классы (что вам действительно нужно), единственный способ выполнить то, что вы хотите, - это сначала сохранить изменяющиеся стили:

var oldFontSize = $(this).css("font-size");
var oldBackgroundColor = $(this).css("background-color");

// set style
// do your thing

$(this).css("font-size",oldFontSize);
// etc...

Answer 2

Я немного изменил решение user147767 , чтобы можно было использовать strings, arrays и objects в качестве ввода:

/*!
 * jquery.removecss.js v0.2 - https://stackoverflow.com/a/17196154/1250044
 * Remove multiple properties from an element in your DOM.
 *
 * @author Yannick Albert | #yckart
 * @param {Array|Object|String} css
 *
 * Copyright (c) 2013 Yannick Albert (http://yckart.com)
 * Licensed under the MIT license (http://www.opensource.org/licenses/mit-license.php).
 * 2013/06/19
 **/

$.fn.removeCss = function (css) {
    var properties = [];
    var is = $.type(css);

    if (is === 'array') properties = css;
    if (is === 'object') for (var rule in css) properties.push(rule);
    if (is === 'string') properties = css.replace(/,$/, '').split(',');

    return this.each(function () {
        var $this = $(this);
        $.map(properties, function (prop) {
            $this.css(prop, '');
        });
    });
};

// set some styling
$('body').css({
    color: 'white',
    border: '1px solid red',
    background: 'red'
});

// remove it again
$('body').removeCss('background');
$('body').removeCss(['border']);
$('body').removeCss({
    color: 'white'
});

http://jsfiddle.net/ARTsinn/88mJF/

Answer 3

Перед добавлением класса вы должны проверить, есть ли у него класс с методом .hasClass ()

По вашему конкретному вопросу. Вы должны положить свои вещи в Cascading Stylesheet. Рекомендуется разделять дизайн и функциональность.

, поэтому предлагаемое решение добавления и удаления имен классов является наилучшей практикой.

однако, когда вы манипулируете элементами, вы не контролируете, как они отображаются. removeAttr ('style') - ЛУЧШИЙ способ удалить все встроенные стили.