jquery如何删除一个css属性

Question

我想用jquery删除一个css属性，比如下面这样的代码

// 增加一个属性
$('#test').css('display', 'none');

// 删除一个属性
$('#test').css('display', null);

把这个css属性设置成null不起作用，而jquery里似乎也没有removeCss的方法，请教如何才能删除一个css属性呢。

有的人可能会说

$('#test').css('display', 'block');

但我并不是要它显示，#test的原始样式在css文件里已经定义好了，我仅仅是想还原这个元素的样式原貌，而把我在js里设置的样式给去掉。

Answer 1

http://stackoverflow.com/questions/95...

$('#test').removeAttr("style")

Answer 2

$('#test').css('display', '');

上面这行就可以。

removeAttr('style')会把所有样式都删掉，不能删除单个'display'样式。

用一个.hide的类，然后toggleClass('hide')，我认为不好用，因为.css加的是行内样式，优先级最高，.hide类里面的样式不会生效，除非加!important。

Answer 3

$('#test').css('display', 'initial');

Answer 4

可以用class去设置,然后removeClass(),比如说

$("#test").attr("style",{"display":"none"});

如果完全不要就可以使用

$("#test").removeAttr("style");

Answer 5

最佳答案是, $('#test').css('display', '');

Answer 6

使用class效率会更高。 而且改动css比改动js要好。

Answer 7

虽然是12年的问题了..不过正好看到,我的思路是这样的...
假设你是

$obj.css('border-color','red');

那么解除的时候用replace把这段替换成''不就好了...

$obj.attr('style',$obj.attr('style').replace('border-color: red;',''));

完美主义如我可以先检测下前置的空格有木有啊,是不是去掉后只剩下一个所以前置的分号也不需要啦,后面的分号到底有没有啊啥的.
疲劳如我就不写了...

Answer 8

使用 removeAttr 就可以了。
另外，如果只是显示和隐藏（不做动画效果），定义一个 .hide {display:none;}，然后使用 addClass() 和 removeClass() 性能会更高。

Answer 9

css文件里面的样式代码是无法通过js去更改的（貌似是这样的），你可以通过.css(name, value)这样的方式去覆盖原有样式，要恢复的话，解铃还需系铃人，这得看你用什么方式覆盖的了。

Answer 10

$('#test').hide();
$('#test').show();
$('#test').toggle();
$('#test').addClass('someClass');
$('#test').removeClass('someClass');

Answer 11

还原css的原貌，在进行更改操作之前先把原来的值保持到一个变量中。

如：var orginalDisplay=$('#test').css('display');

$('#test').css('display','none');

$('#test').css('display',originalDisplay);

Answer 12

removeAttr() 其实如果是样式加的很多可以写成单独的class 来删除添加，这样也可以支持css3动画，效果更好

Answer 13

多用addClass和removeClass吧，这个效率高

Answer 14

换个思路，若是在增加属性的时候使用attr增加，则想删除相应属性时，就可以方便的用removeAttr来删除了
例如：
$("#test").attr("display","none");
$("#test").removeAttr("display");

Answer 15

jquery中貌似没有addClass和removeClass这两个方法啊！我用的是$("#test").css("background-color","")
（更改背景颜色）

Answer 16

$(function home(){

    $("#home").hover(function(){
        $("#home").css("background-color","red");
    },function(){
        $("#home").css("background-color","");
    });
});

移入移出效果。

Answer 17

$('#test')[0].style.display = '';