CSSOM 视图 API

指南

坐标系

坐标系常用于指定显示上下文中位置，例如显示器的窗口、移动设备上的视口，或打印时纸张上的位置。

视口概念

视口的概念——什么是视口，视口在 CSS、SVG 和移动设备中的影响，以及可视视口与布局视口之间的区别。

接口

• MediaQueryList
• MediaQueryListEvent
• Screen
• CaretPosition
• VisualViewport

对其他接口的扩展

此模块为其他规范中定义的接口添加了属性、方法和事件。

扩展 Window

• devicePixelRatio
• innerHeight
• innerWidth
• matchMedia()
• moveBy()
• moveTo()
• outerHeight
• outerWidth
• pageXOffset（查看 scrollX）
• pageYOffset（查看 scrollY）
• resizeBy()
• resizeTo()
• screen
• screenLeft
• screenTop
• screenX
• screenY
• visualViewport
• scroll()
• scrollBy()
• scrollTo()
• scrollX
• scrollY
• resize 事件

扩展 Document

• elementFromPoint()
• caretPositionFromPoint()
• scrollingElement
• scroll 事件
• scrollend 事件

扩展 Element

• checkVisibility()
• clientHeight
• clientLeft
• clientTop
• clientWidth
• currentCSSZoom
• getBoundingClientRect()
• getClientRects()
• scroll()
• scrollBy()
• scrollHeight
• scrollIntoView()
• scrollLeft
• scrollTo()
• scrollTop
• scrollWidth
• scroll 事件
• scrollend 事件

扩展 HTMLElement

• offsetHeight
• offsetLeft
• offsetParent
• offsetTop
• offsetWidth

扩展 HTMLImageElement

• x
• y

扩展 Range

• getBoundingClientRect()
• getClientRects()

扩展 MouseEvent

• clientX
• clientY
• offsetX
• offsetY
• pageX
• pageY
• screenY
• x
• y

本模块定义了适用于 Text、Element、CSSPseudoElement、Document 接口的几何辅助方法。这些 GeometryUtils 功能目前尚未在任何浏览器中实现。

规范

参见

• CSS 对象模型（CSSOM） API
• CSS 对象模型视图模块
• CSS 溢出模块
• CSS 滚动行为模块
• CSS 滚动吸附模块
• 视口
• 布局视口
• 可视视口
• CSS 属性：zoom
• CSS 对象模型
• CSS 像素
• 滚动容器
• 元数据元素