28 Меняем стили и классы через JS

В этом уроке продолжаем изучать JavaScript и работу с DOM. На прошлом уроке мы разобрали атрибуты и свойства HTML-элементов, а сегодня научимся управлять стилями элементов прямо из JavaScript. Разберём несколько способов работы со стилями и классами и поймём, когда какой способ лучше использовать. В этом уроке вы узнаете: какие существуют способы задавать стили в HTML и CSS; чем отличаются стили из CSS-файла, `style` и inline-стили; как изменять стили HTML-элемента через JavaScript; как работает свойство `style`; почему CSS-свойства в JavaScript записываются в формате camelCase; как задавать несколько CSS-свойств через `style.cssText`; как изменять классы HTML-элементов с помощью JavaScript; почему `className` может быть неудобен при работе с несколькими классами; что такое `classList`; как работают методы `classList.add()`, `remove()` и `toggle()`; как перебрать классы элемента; почему через `element.style` нельзя получить стили, заданные во внешнем CSS; что такое `getComputedStyle()` и для чего он нужен; как получить фактические вычисленные стили элемента. В конце урока разберём небольшое домашнее задание на добавление и удаление CSS-классов. 🎯 Цель урока — научиться уверенно управлять стилями и классами HTML-элементов с помощью JavaScript. Если вы только начинаете изучать JavaScript и DOM — этот урок поможет разобраться в теме простыми словами и на практике. *JavaScript для начинающих — Просто. Понятно. С нуля.*