getBoundingClientRectの読み方

getBoundingClientRectの読み方

javascriptで利用されるメソッドの1つである「getBoundingClientRect」の読み方を掲載してます。

読み⽅

ゲット・バウンディング・クライアント・レクト」と読みます。

英訳

「Bounding」は「境界」という意味があります。
「Rect」は「長方形」という意味があります。

getBoundingClientRectとは

javascriptで、要素の各座標を取得するメソッドとなります。

/** html **/

<div id="result"></div>

/** js **/

// 上からのY座標
result.getBoundingClientRect().top;
// 左からのx座標
result.getBoundingClientRect().left;
// 右からのx座標
result.getBoundingClientRect().right;
// 下からのY座標
result.getBoundingClientRect().bottom;