DOMRect

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

DOMRect は矩形の大きさと位置を記述します。

DOMRect が表すボックスの型は、それを返したメソッドやプロパティで指定されます。例えば、Range.getBoundingClientRect()は、そのようなオブジェクトを使用した範囲のコンテンツを囲む長方形を指定します。

親である DOMRectReadOnly から継承しています。

DOMRectReadOnly DOMRect

コンストラクター

DOMRect()

新しい DOMRect オブジェクトを作成します。

インスタンスプロパティ

DOMRect は親である DOMRectReadOnly からプロパティを継承しています。違いはそれらが読み取り専用でなくなることです。

DOMRectReadOnly.x

この DOMRect の原点(ふつうは矩形の左上隅)の X 座標です。

DOMRectReadOnly.y

この DOMRect の原点(ふつうは矩形の左上隅)の Y 座標です。

DOMRectReadOnly.width

この DOMRect の幅です。

DOMRectReadOnly.height

この DOMRect の高さです。

DOMRectReadOnly.top

この DOMRect の上端の座標値を返します(ふつうは y と同じ、 height が負の数である場合は y + height と同じです)。

DOMRectReadOnly.right

この DOMRect の右端の座標値を返します(ふつうは x + width と同じ、 width が負の数である場合は x と同じです)。

DOMRectReadOnly.bottom

この DOMRect の下端の座標値を返します(ふつうは y + height と同じ、 height が負の数である場合は y と同じです)。

DOMRectReadOnly.left

この DOMRect の左端の座標値を返します(ふつうは x と同じ、 width が負の数である場合は x + width と同じです)。

静的メソッド

DOMRect には親である DOMRectReadOnly から継承した静的メソッドもあります。

DOMRect.fromRect()

新しい DOMRect オブジェクトを指定した位置と寸法で作成します。

インスタンスメソッド

DOMRect は親である DOMRectReadOnly からメソッドを継承しています。

仕様書

Specification
Geometry Interfaces Module Level 1
# DOMRect

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
DOMRect
DOMRect() constructor
fromRect() static method
height
width
Available in workers
x
y

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Uses a non-standard name.
Has more compatibility info.

関連情報