ブラウザ js の、DOM要素のサイズを取得するプロパティ/メソッドの話。
js標準であるECMAScriptでは、jQuery なら .innerWidth
であらわされるものが .clientWidth
に、.outerWidth
であらわされるものが .offsetWidth
になるんですと。
多少わかりにくい命名なのだが、これ単体なら命名の違い程度にしか思わない。
しかし、ウィンドウの幅を取得するときにはECMAScriptは window.innerWidth
(ウィンドウ内側表示領域(垂直スクロールバー含む))、window.outerWidth
(ブラウザのウィンドウサイズ)を使うんですと。
統一しとけよって思う。
マウスイベントなどのときの `offsetX` や `clientX` の扱い方とかを見る限り、JavaScriptは "offset" や "client" という語をかなりいい加減に扱っているように思われる。(ここでは `client` をウィンドウからの距離、`offset` を発火したDOM要素からの距離として扱っている)
ところで、DOM要素のサイズを取得するのに`getClientRects()`というのがあるが、直接`offsetWidth`で取得できるのに、このメソッドの存在意義はあるのだろうか?
(getClientRects()の返り値のDOMRectの`height`が`offsetHeight`、`width`が`offsetWidth`相当)
なんかうまくまとめてる記事見つけた。