要素の幅を取得したい場合、offsetWidth を使用する事あります。

offsetWidthとは

offsetWidth は要素のレイアウト幅を表します。
ボーダーの幅、パディング、垂直スクロールバーの幅も含みます。

値

ピクセル単位の値が返却されます。

HTML

<div class="sample"></div>

CSS

.sample {
  width: 100px;
  height: 100px;
  padding: 15px;
  border: 10px solid black;
}

javascript

const sample = document.querySelector('.sample');
sample.textContent = sample.offsetWidth;

結果

非表示の要素

display: none のように、非表示の要素の offsetWidth は 0 になります。

読み取り専用

offsetWidth は読み取り専用のプロパティになります。
offsetWidth に値を設定することは出来ません。

最後に

特にありません。