CSSStyleDeclaration
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.
Интерфейс CSSStyleDeclaration
представляет объект, являющийся блоком объявления CSS, и предоставляет информацию о стиле и различные связанные со стилем методы и свойства.
Объект CSSStyleDeclaration
может быть представлен с помощью трёх различных API:
- Через
HTMLElement.style
, который имеет дело с встроенными стилями одного элемента (например, <div style="...">). - Через API
CSSStyleSheet
. Например,document.styleSheets[0].cssRules[0].style
возвращает объектCSSStyleDeclaration
для первого правила CSS в первой таблице стилей документа. - Через
Window.getComputedStyle ()
, который предоставляет объектCSSStyleDeclaration
в качестве интерфейса только для чтения.
Атрибуты
CSSStyleDeclaration.cssText
-
Текстовое представление блока объявления. Установка этого атрибута изменяет стиль.
CSSStyleDeclaration.length
Только для чтения-
Количество свойств. Смотри ниже метод
item()
. CSSStyleDeclaration.parentRule
Только для чтения-
Содержащееся
CSSRule
.
Методы
CSSStyleDeclaration.getPropertyPriority()
-
Возвращает необязательный приоритет "important".
CSSStyleDeclaration.getPropertyValue()
-
Возвращает значение свойства, заданное именем свойства.
CSSStyleDeclaration.item()
-
Возвращает имя свойства.
CSSStyleDeclaration.removeProperty()
-
Удаляет свойство из блока объявления CSS.
CSSStyleDeclaration.setProperty()
-
Изменяет существующее свойство CSS или создаёт новое свойство CSS в блоке объявления.
CSSStyleDeclaration.getPropertyCSSValue()
-
Поддерживается только через getComputedStyle в Firefox. Возвращает значение свойства в виде
CSSPrimitiveValue
илиnull
для сокращённых свойств.
Пример
var styleObj = document.styleSheets[0].cssRules[0].style;
console.log(styleObj.cssText);
for (var i = styleObj.length; i--; ) {
var nameString = styleObj[i];
styleObj.removeProperty(nameString);
}
console.log(styleObj.cssText);
Спецификации
Specification |
---|
CSS Object Model (CSSOM) # the-cssstyledeclaration-interface |
Совместимость с браузерами
BCD tables only load in the browser