Can't access CSS some style fields from javascript

Question

Is there a reason why I can do this:

document.getElementById('gridID').style.background='blue';

but when I try this:

document.getElementById('gridID').style.background-color='blue';

throws this:

 Uncaught ReferenceError: Invalid left-hand side in assignment

I need to access backgroundPosition and some other things and they just aren't working. They do not appear in xcode's autosuggest when I type and they do not work when I try them anyways. Any thoughts? I haven't found similar problems on Google to my surprise.

Thanks, Chet.

It may be worth noting that gridID is the id for a div.

Chet
– Chet

2012-03-19 03:31:22 +00:00
Commented Mar 19, 2012 at 3:31 — Chet
– Chet, Commented Mar 19, 2012 at 3:31

SLaks · Accepted Answer · 2012-03-19 03:31:49Z

4

Javascript identifiers cannot contain -s.

Instead, use camelCase:

document.getElementById('gridID').style.backgroundColor='blue';

answered Mar 19, 2012 at 3:31

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

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

2 Comments

nrabinowitz Over a year ago

Not true, actually - myObject['background-color'] is perfectly valid. But you can't use - in dot notation, because it is interpreted as a minus sign.

SLaks Over a year ago

@nrabinowitz: True, although that won't actually do anything. Clarified.

Joseph · Accepted Answer · 2012-03-19 03:30:56Z

1

try:

document.getElementById('gridID').style.backgroundColor='blue';

for styles that have more than one word (like background-color) JS uses camelCased names instead of dash-separated names,

answered Mar 19, 2012 at 3:30

Joseph

120k31 gold badges186 silver badges238 bronze badges

Collectives™ on Stack Overflow

Can't access CSS some style fields from javascript

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related