CSSStyleDeclaration
interface represents an object that is a CSS declaration block, and exposes style information and various style-related methods and properties.
A
CSSStyleDeclaration
object can be exposed using three different APIs:
HTMLElement.style
, which deals with the inline styles of a single element (e.g.,
<div style="...">
).
CSSStyleSheet
API. For example,
document.styleSheets[0].cssRules[0].style
返回
CSSStyleDeclaration
object on the first CSS rule in the document's first stylesheet.
Window.getComputedStyle()
, which exposes the
CSSStyleDeclaration
object as a
只读
接口。
CSSStyleDeclaration.cssText
Textual representation of the declaration block. Setting this attribute changes the style.
CSSStyleDeclaration.length
只读
item()
method below.
CSSStyleDeclaration.parentRule
只读
CSSRule
.
CSSStyleDeclaration.cssFloat
float
CSS property.
CSSStyleDeclaration
named properties
Dashed and camel-cased attributes for all supported CSS properties.
CSSStyleDeclaration.getPropertyPriority()
Returns the optional priority, "important".
CSSStyleDeclaration.getPropertyValue()
Returns the property value given a property name.
CSSStyleDeclaration.item()
Returns a CSS property name by its index, or the empty string if the index is out-of-bounds.
nodeList[
i
]
(which instead returns
undefined
当
i
is out-of-bounds). This is mostly useful for non-JavaScript DOM implementations.
CSSStyleDeclaration.removeProperty()
Removes a property from the CSS declaration block.
CSSStyleDeclaration.setProperty()
Modifies an existing CSS property or creates a new CSS property in the declaration block.
CSSStyleDeclaration.getPropertyCSSValue()
CSSPrimitiveValue
or
null
for
shorthand properties
.
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);
| 规范 | 状态 | 注释 |
|---|---|---|
|
CSS Object Model (CSSOM)
The definition of 'CSSStyleDeclaration' in that specification. |
工作草案 |
Merged the
DOM Level 2 Style
CSS2Properties
interface into
CSSStyleDeclaration
.
|
|
Document Object Model (DOM) Level 2 Style Specification
The definition of 'CSSStyleDeclaration' in that specification. |
过时 | 初始定义 |
| 桌面 | 移动 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
CSSStyleDeclaration
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari Yes | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
cssFloat
|
Chrome 46 | Edge 12 | Firefox No | IE ? | Opera Yes | Safari 11 | WebView Android 46 | Chrome Android 46 | Firefox Android No | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 5.0 |
cssText
|
Chrome 1 | Edge 12 | Firefox 1 | IE ? | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
getPropertyCSSValue
弃用
|
Chrome
? — 41
|
Edge
No
|
Firefox
1 — 62
|
IE No |
Opera
15 — 28
|
Safari 6 |
WebView Android
? — 41
|
Chrome Android
? — 41
|
Firefox Android 4 — 62 |
Opera Android
14 — 28
|
Safari iOS Yes |
Samsung Internet Android
? — 4.0
|
getPropertyPriority
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
getPropertyValue
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
item
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
length
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
parentRule
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
removeProperty
|
Chrome 1 | Edge 12 | Firefox 1 | IE Yes | Opera Yes | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android Yes | Safari iOS Yes | Samsung Internet Android 1.0 |
setProperty
|
Chrome 1 | Edge 12 | Firefox 1 | IE 9 | Opera 9 | Safari 6 | WebView Android 4.4 | Chrome Android 18 | Firefox Android 4 | Opera Android 10.1 | Safari iOS 6 | Samsung Internet Android 1.0 |
完整支持
不支持
兼容性未知
弃用。不要用于新网站。
见实现注意事项。
CSSStyleDeclaration
AnimationEvent
CSS
CSSConditionRule
CSSGroupingRule
CSSKeyframeRule
CSSKeyframesRule
CSSMediaRule
CSSNamespaceRule
CSSPageRule
CSSRule
CSSRuleList
CSSStyleRule
CSSStyleSheet
CSSSupportsRule
CaretPosition
LinkStyle
MediaQueryList
MediaQueryListListener
Screen
StyleSheet
StyleSheetList
TransitionEvent