Свойство offsetWidth в JavaScript
Свойство offsetWidth
содержит полную ширину элемента (включает собственно ширину элемента, ширину границ, padding, полосы прокрутки).
Синтаксис
элемент.offsetWidth
Пример
В данном примере offsetWidth = border-left + padding-left + width + padding-right + border-right = 10 + 15 + 100 + 15 + 10 = 150:
<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