Свойство cssText в JavaScript
Свойство cssText
позволяет задать несколько CSS-стилей элементу сразу одной строкой. Это удобно, когда нужно быстро применить множество стилей без использования отдельных свойств объекта style
.
element.style.cssText = 'правило1; правило2; ...';
Реальный пример кода по применению нескольких стилей
let box = document.getElementById('myBox');
box.style.cssText = 'width: 200px; height: 100px; background: black;';
Пример добавления новых стилей, без удаления старых
box.style.cssText += 'border: 2px solid black;';
Если обратиться к cssText
, то он вернет данные в виде строки
console.log(box.style.cssText);
// "width: 200px; height: 100px; background: black;"
Если требуется добавлять стили без перезаписи существующих, лучше использовать classList.add()
для работы с классами или отдельные свойства style
.
cssText
— это быстрый способ массового применения стилей, но с ним нужно быть осторожным: он удаляет все предыдущие inline-стили
. Если стиль элемента меняется динамически, лучше использовать style.property
или классы.