James K Nelson
For example, consider this snippet of HTML:
<div id='navbar' class='dark'> <a href="/">Home</a> </div>
To interact with the navbar
But what if you want to access the
class? The obvious property to try would be
style strings vs. objects #
style property is also a little different, and when you think about it for a minute, its not hard to see why.
The thing about
style strings is that each string contains many individual pieces of information. Getting or setting a single piece with string manipulation would be all kinds of awful.
And that’s why the DOM treats an element’s
style as an object instead of a string.
To get or set the value of a single style property, you just access its camelCased name underneath the DOM node’s
style object. For example:
Camel casing #
HTML, like most other technologies, has one of those nice-for-beginners but shit-for-everyone-else features: it’s attributes are case insensitive.
If you first learned HTML in this century, you’re probably used to seeing attributes in
And how do you convert
camelCase? Through trial and error, and after that, by checking MDN.
Here are a few to watch out for, as well as some other exceptions:
If it seems that the browser is ignoring a DOM propery, it may just be a matter of capitalization.