jquery - Is it possible to use .css() to change property

Question

Actually i'm studying jQuery and using Twitter BootStrap to try to develop a WP template. What I would like to achieve is the possibility to change a css property using jquery.

This is what I would like to achieve

From this:

margin-left: 2.564102564102564%;

To this:

margin-right: 2.564102564102564%;

As you can see I would like to keep the value but change the property.

This is the 'original' css part:

.row-fluid [class*="span"] {
display: block;
width: 100%;
min-height: 30px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
margin-left: 2.564102564102564%;
}

Answer 1

You just need to adjust the margin-left and margin-right values accordingly.

$('.row-fluid [class*="span"]').css({
    'margin-left':'0',
    'margin-right':'2.564102564102564%'
});

Answer 2

var elems = $('.row-fluid [class*="span"]');

elems.css({
    marginRight : elems.css('margin-left'), // gets the margin from the first element
    marginLeft  : 0
});

请注意，它css()为集合中的所有元素设置值，但从集合中的第一个元素获取值。

Answer 3

您必须分两步完成。删除左边距，然后添加右边距：

$('.row-fluid [class*="span"]').css('margin-left', 0);
$('.row-fluid [class*="span"]').css('margin-right', '2.564102564102564%');

Answer 4

只需读取属性，保存其值，删除属性并使用保存的值添加新属性。

var tmp = $('.row-fluid [class*="span"]').css('margin-left');
$('.row-fluid [class*="span"]').css({'margin-left': 0, 'margin-right': tmp});