CSSRule: type property
Deprecated
Avoid using this feature in new projects. This feature may be a candidate for removal from web standards or browsers.
The read-only type property of the
CSSRule interface is a deprecated property that returns an integer
indicating which type of rule the CSSRule represents.
If you need to distinguish different types of CSS rule, a good alternative is to use constructor.name:
const sheets = Array.from(document.styleSheets);
const rules = sheets.map((sheet) => Array.from(sheet.cssRules)).flat();
for (const rule of rules) {
console.log(rule.constructor.name);
}
Value
CSSRule.STYLE_RULE(1)-
The rule is a
CSSStyleRule, the most common kind of rule:selector { prop1: val1; prop2: val2; }. CSSRule.IMPORT_RULE(3)-
The rule is a
CSSImportRuleand represents an@importrule. CSSRule.MEDIA_RULE(4)-
The rule is a
CSSMediaRule. CSSRule.FONT_FACE_RULE(5)-
The rule is a
CSSFontFaceRule CSSRule.PAGE_RULE(6)-
The rule is a
CSSPageRule. CSSRule.KEYFRAMES_RULE(7)-
The rule is a
CSSKeyframesRule. CSSRule.KEYFRAME_RULE(8)-
The rule is a
CSSKeyframeRule. CSSRule.MARGIN_RULE(9)-
The rule is a
CSSMarginRule. CSSRule.NAMESPACE_RULE(10)-
The rule is a
CSSNamespaceRule. CSSRule.COUNTER_STYLE_RULE(11)-
The rule is a
CSSCounterStyleRule. CSSRule.SUPPORTS_RULE(12)-
The rule is a
CSSSupportsRule. CSSRule.FONT_FEATURE_VALUES_RULE(14)-
The rule is a
CSSFontFeatureValuesRule.
The values CSSRule.UNKNOWN_RULE (0), CSSRule.CHARSET_RULE (2), CSSRule.DOCUMENT_RULE (13), CSSRule.VIEWPORT_RULE (14), and CSSRule.REGION_STYLE_RULE (16) cannot be obtained anymore.
Examples
const rules = document.styleSheets[0].cssRules;
console.log(rules[0].type);
Specifications
| Specification |
|---|
| CSS Object Model (CSSOM) # concept-css-rule-type |