CSSRule.type
非推奨: この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。
type は CSSRule インターフェイスの読み取り専用プロパティで、非推奨です。この CSSRule が表すルールの型を示す整数を返します。
様々な CSS ルールの型を見分ける必要がある場合は、 constructor.name を使用するのが良い代替手段です。
js
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);
}
値
CSSRule.STYLE_RULE(1)-
このルールは
CSSStyleRuleで、selector { prop1: val1; prop2: val2; }のような最も一般的な種類のルールです。 CSSRule.IMPORT_RULE(3)-
このルールは
CSSImportRule(en-US) で、@importルールを表します。 CSSRule.MEDIA_RULE(4)-
このルールは
CSSMediaRuleです。 CSSRule.FONT_FACE_RULE(5)-
このルールは
CSSFontFaceRuleです。 CSSRule.PAGE_RULE(6)-
このルールは
CSSPageRuleです。 CSSRule.KEYFRAMES_RULE(7)-
このルールは
CSSKeyframesRuleです。 CSSRule.KEYFRAME_RULE(8)-
このルールは
CSSKeyframeRuleです。 CSSRule.NAMESPACE_RULE(10)-
このルールは
CSSNamespaceRuleです。 CSSRule.COUNTER_STYLE_RULE(11)-
このルールは
CSSCounterStyleRule(en-US) です。 CSSRule.SUPPORTS_RULE(12)-
このルールは
CSSSupportsRuleです。 CSSRule.DOCUMENT_RULE(13)-
このルールは
CSSDocumentRuleです。 CSSRule.FONT_FEATURE_VALUES_RULE(14)-
このルールは
CSSFontFeatureValuesRule(en-US) です。 CSSRule.VIEWPORT_RULE(15)-
このルールは
CSSViewportRuleです。 CSSRule.REGION_STYLE_RULE(16)-
このルールは
CSSRegionStyleRuleです。
CSSRule.UNKNOWN_RULE (0) と CSSRule.CHARSET_RULE (2) は非推奨であり、受け取ることはできません。
例
js
let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0].type);
仕様書
| Specification |
|---|
| CSS Object Model (CSSOM) # concept-css-rule-type |
ブラウザーの互換性
BCD tables only load in the browser