getBoundingClientRectメソッド
メソッド getBoundingClientRect は、
要素の座標オブジェクトを含みます。座標は、
スクロールを考慮しない（ウィンドウからの）
ページの表示部分から計算されます。つまり、
position
プロパティの値 fixed の場合と同様です。
返されるオブジェクトには、left、
top、right、bottom、width、height
プロパティが含まれます。
これらのプロパティはCSSプロパティとは何の関係もないことに
注意する必要があります。これらには、
要素の対応する辺までの距離が含まれています。
left/right については表示領域の左端から、
top/bottom については上端からの距離です。
構文
要素.getBoundingClientRect();
例
要素の座標を取得します：
<div id="elem"></div>
#elem {
width: 100px;
height: 100px;
border: 1px solid black;
}
let elem = document.querySelector('#elem');
console.log(elem.getBoundingClientRect());
関連項目
-
プロパティ
offsetParent、
これは、配置された親要素を含みます -
プロパティ
offsetTop、
これは、要素の上からのオフセットを含みます -
プロパティ
offsetLeft、
これは、要素の左からのオフセットを含みます -
メソッド
elementFromPoint、
これは、座標から要素を返します
