プロパティ offsetWidth
プロパティ offsetWidth は、要素の完全な
幅を含みます（要素自体の幅、
ボーダーの幅、内部のパディング、
スクロールバーを含みます）：
構文
要素.offsetWidth;
例
要素の完全なサイズを調べてみましょう：
<div id="elem"></div>
#elem {
width: 100px;
height: 100px;
padding: 15px;
border: 10px solid black;
}
let elem = document.querySelector('#elem');
console.log(elem.offsetWidth);
コードの実行結果：
150
例
要素が非表示の場合、offsetWidth は
0 になります：
<div id="elem"></div>
#elem {
display: none; /* 非表示の要素 */
width: 100px;
height: 100px;
padding: 15px;
border: 10px solid black;
}
let elem = document.querySelector('#elem');
console.log(elem.offsetWidth);
コードの実行結果：
0
関連項目
-
プロパティ
clientWidth,
これはボーダー内側の要素の幅を含みます -
プロパティ
offsetHeight,
これは要素の完全な高さを含みます -
メソッド
getComputedStyle,
これは要素のCSSプロパティの値を取得します
