27. Styling our Content

In This Chapter

  • Learn how to change CSS using JavaScript

  • Understand the pros and cons of setting styles directly as opposed to adjusting class values

  • Use classList to make fiddling with element class values a breeze

In the previous chapter, we looked at how to modify our DOM’s content using JavaScript. The other part of what makes our HTML elements stand out is their appearance, their styling. When it comes to styling some content, the most common way is by creating a style rule and have its selector target an element or elements. A style rule would look as follows:

.batman {
  width: 100px;
  height: 100px;
  background-color: #333;
}

An element that would be affected by this style rule ...

Get JavaScript Absolute Beginner's Guide, 2nd Edition now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.