要素のスクロールバーの幅を取得する

スクロールバーの幅を取得するには、ElementのoffsetWidthとclientWidthを使用します。

• offsetWidthは、スクロールバーを含むElementの幅をピクセル単位で返します。
• clientWidthは、スクロールバーを含まないElementの幅をピクセル単位で返します。

したがって、スクロールバーの幅を取得するには、次のように簡単な計算を行うだけです。

const box = document.querySelector('.box');
const scrollbarWidth = box.offsetWidth - box .clientWidth;Code language: JavaScript (javascript)

以下は、ドキュメントのスクロールバーの幅を返します。

const scrollbarWidth = document.body.offsetWidth - document.body.clientWidth;Code language: JavaScript (javascript)