使用jQuery删除CSS"top"和"left"属性

Question

我正在构建一个可拖动的地图,当拖动地图时,元素被赋予"左"和"顶部"属性,每个属性的值都是如此......

<div class="map" style="top:200px; left:100px;">Map</div>

我有一个按钮,我想在单击时从div上的内联样式中删除top和left属性,这是否可以使用jquery？

Answer 1

如果要专门删除top和left属性并保留其他属性,可以执行以下操作:

$('.map').css('top', '').css('left', '');

或者,更短的等价物:

$('.map').css({
    'top': '',
    'left': ''
});

这是一个比选择的更好的答案. (64认同)
这是问题的正确答案 (3认同)
这是最好的答案.但我想我找到了另一个.我试了几个不同的.`.css('left',undefined);`没有改变任何东西.传递null也没有做任何事情.但是`.css('left',false);`删除了那个属性. (2认同)

Answer 2

对CSS的默认值top和left被auto,因此将它们设置为,可能是等价取决于你想做什么:

$('.map').css('top', 'auto').css('left', 'auto');

您还可以选择完全删除style属性:

$('.map').removeAttr('style');

但是,如果您正在使用其他jQuery UI组件,那么这些组件可能需要您不希望删除的内联样式,因此请谨慎操作.

通常,添加到style属性的这种覆盖用于将值从默认的css值更改为off; 将其设置为自动不会将它们重置为默认值.意思是汽车不是真的相同,然后没有价值.所以正确答案是$('map').css('top',''); (61认同)
这个答案是错误的,你不是*删除*属性,而是用其他东西替换它们.此外,删除整个样式标签没有太大意义,人们可能想要保留一些attrs并删除其他.. wtrevino的答案是正确的. (15认同)
为了记录,@ wtrevino的答案应该是这里接受的答案.在某些情况下,这个特殊的解决方案对我有用,但如果可以的话,我会删除这个答案.不幸的是,既然它被接受了,它就不会让我. (5认同)

Answer 3

您可以style通过执行以下操作删除属性中的所有内容:

$('.map').removeAttr('style');

你可以通过以下方式删除特定style的:

$('.map').css('top', '');
$('.map').css('left', '');

Answer 4

只需使用空字符串设置CSS属性,例如使用以下代码:

$('#mydiv').css('color', '');

Answer 5

将样式属性的值设置为空字符串 - 例如$("#mydiv").css("color","") - 如果元素已经直接应用,则从元素中删除该属性,无论是HTML样式属性,通过jQuery的.css()方法,或通过样式属性的直接DOM操作.

文档为您提供了当前推荐的方法,可以帮助您节省时间,因为您无需在堆栈溢出时来回阅读火焰战争(无论多么有趣/有启发性) !).

Answer 6

element.removeAttr('style')

在基于Webkit的浏览器中不能始终如一地工作.例如,我在iOS 6.1上遇到了这个问题.修复是使用:

element.attr('style', '')