Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript and the DOM (Retiring) The Browser Environment Thinking Globally

Devjyoti Ghosh
Devjyoti Ghosh
2,422 Points

Why backgroundColor?

Why is the property to change that background color in JavaScript backgroundColor instead of background-color used in CSS?

2 Answers

Michael Hulet
Michael Hulet
47,911 Points

It's conventional in JavaScript to write variable and function names likeThis. Perhaps more importantly, however, the - character in function and variable names is not allowed in JavaScript, and using one there will present a syntax error (or hang up the interpreter). This is because the - character is also the subtraction operator in JavaScript, so if it sees one of those in a variable called background-color, it'd think that it's supposed to subtract a variable color from a variable background

Joel Stevenson
Joel Stevenson
4,137 Points

How would we know that was the variable name? Where did it come from? I'm confused.

Michael Hulet
Michael Hulet
47,911 Points

Ultimately, we know because the documentation says so. However, in general, if a property is written like-this-in-css, it'll be written likeThisInJavaScript

It seems that I typed background and it works. I am not sure why use background-color or backgroundColor?

document.getElementById('myHeading').style.background = 'yellow'