CSS オブジェクトモデル (CSSOM)
CSS オブジェクトモデルは CSS を JavaScript から操作するための API の集合です。これは DOM にとても良く似ていますが HTML ではなく CSS のためのものです。これにより CSS スタイルを動的に読んだり変更したりすることができます。
リファレンス
AnimationEventCaretPositionCSSCSSCharsetRuleCSSConditionRule(en-US)CSSCounterStyleRule(en-US)CSSFontFaceRule(en-US)CSSFontFeatureValuesMapCSSFontFeatureValuesRuleCSSGroupingRule(en-US)CSSImportRule(en-US)CSSKeyframeRuleCSSKeyframesRule(en-US)CSSMarginRuleCSSMediaRuleCSSNamespaceRule(en-US)CSSPageRuleCSSRuleCSSRuleList(en-US)CSSStyleDeclarationCSSStyleSheetCSSStyleRuleCSSSupportsRuleCSSVariablesMapCSSViewportRuleElementCSSInlineStyleFontFace(en-US)FontFaceSet(en-US)FontFaceSetLoadEvent(en-US)GeometryUtils(en-US)GetStyleUtilsLinkStyleMediaList(en-US)MediaQueryListMediaQueryListEvent(en-US)MediaQueryListListener(en-US)ScreenStyleSheetStylesheetListTransitionEvent
他にも CSSOM に関する仕様書で拡張されているインターフェイスがあります。 Document, Window, Element, HTMLElement, HTMLImageElement (en-US), Range, MouseEvent, SVGElement
CSS 型付きオブジェクトモデル
Experimental
これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
CSSImageValue(en-US)CSSKeywordValue(en-US)CSSMathInvert(en-US)CSSMathMax(en-US)CSSMathMin(en-US)CSSMathNegate(en-US)CSSMathProduct(en-US)CSSMathSum(en-US)CSSMathValue(en-US)CSSMatrixComponent(en-US)CSSNumericArray(en-US)CSSNumericValue(en-US)CSSPerspective(en-US)CSSPositionValue(en-US)CSSRotate(en-US)CSSScale(en-US)CSSSkew(en-US)CSSSkewX(en-US)CSSSkewY(en-US)CSSStyleValue(en-US)CSSTransformComponent(en-US)CSSTransformValue(en-US)CSSTranslate(en-US)CSSUnitValue(en-US)CSSUnparsedValueCSSVariableReferenceValueStylePropertyMap(en-US)StylePropertyMapReadOnly(en-US)
廃止された CSSOM インターフェイス
廃止
この機能は廃止されました。まだいくつかのブラウザーで動作するかもしれませんが、いつ削除されてもおかしくないので、使わないようにしましょう。
チュートリアル
- Determining the dimensions of elements (これは DHTML/Ajax 時代に作られたのでいくらか更新が必要です)。
- 画面の向きの管理
仕様書
| 仕様書 | 状態 | 備考 |
|---|---|---|
| CSS Typed OM Level 1 | 草案 | |
| CSS Painting API Level 1 | 草案 | CSS インターフェイスを paintWorklet 静的プロパティで拡張。 |
| CSS Object Model (CSSOM) View Module | 草案 | Screen および MediaQueryList インターフェイスと MediaQueryListEvent (en-US) イベントと MediaQueryListListener (en-US) イベントリスナーを定義。 |
| CSS Object Model (CSSOM) | 草案 | CSS インターフェイスを拡張し、最新の CSSOM 仕様書の基礎を提供。 |
| Screen Orientation API | 草案 | |
| CSS Fonts Module Level 3 | 勧告 | |
| CSS Animations Level 1 | 草案 | |
| CSS Transitions | 草案 | |
| CSS Custom Properties for Cascading Variables Module Level 1 | 勧告候補 | |
| CSS Conditional Rules Module Level 3 | 勧告候補 | CSS インターフェイスを定義。 |
| CSS Device Adaptation | 草案 | |
| CSS Counter Styles Level 3 | 勧告候補 | |
| Document Object Model (DOM) Level 2 Style Specification | 廃止 | 初回定義 |
ブラウザーの互換性
この機能のすべてはさまざまなブラウザーで何年かけて少しずつ追加されてきました。これは簡単なページにまとめることができないとても複雑なプロセスでした。利用できるかについてはそれぞれのインターフェイスを参照してください。