JS / jQuery : Variable .css() propertyName

Question

How can I store property name as a variable?

Example code:

var propertyName = 'margin-top';
$('elem').css({ propertyName : '10px' });

.css(strWhatever, value); or make a dynamic object using array syntax. — dandavis
– dandavis, Commented Jan 15, 2015 at 21:12

Daniel Weiner · Accepted Answer · 2015-01-15 21:41:41Z

2

You can store the argument for css() as a variable, and then add the property to it:

var propertyName = 'margin-top';
var cssArg = {};
cssArg[propertyName] = '10px';
$('elem').css(cssArg);

Edit:

In the future (ES6) you'll be able to do that in one line using computed properies:

$('elem').css({ [propertyName] : '10px'});

But for now, you have to stick with the long way.

answered Jan 15, 2015 at 21:13

Daniel Weiner

1,9041 gold badge12 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

haim770 · Accepted Answer · 2015-01-15 21:12:44Z

0

For single CSS directive change, you could simply do this:

var propertyName = 'margin-top';
$('elem').css(propertyName, '10px');

If you still need to pass Object in order to manipulate multiple directives, you could try this:

var cssData = {};
var propertyName = 'margin-top';
cssData[propertyName] = '10px';

$('elem').css(cssData);

answered Jan 15, 2015 at 21:12

haim770

49.2k7 gold badges112 silver badges139 bronze badges