Вот оно — поколение
jQuery... Ничего, кроме библиотек, не знают...
Есть метод глобального объекта
getComputedStyle, предназначенный именно для получения стилей из всех источников, включая стили пользователя, агента и описанные в элементе
style (подключённые через
link), а не только инлайн-стили (описанные в атрибуте
style).
Для получения размера элемента по границе
border-box в интерфейсе
Element существует существует метод
getBoundingClientRect, возвращающий объект с координатами границ относительно левого верхнего угла текущей области просмотра (он же
viewport).
Также для получения информации о размерах элемента в том же интерфейсе
Element есть 3 группы —
offset,
client и
scroll, в каждой из которых по 4 свойства. В данном конкретном случае можно, в зависимости от цели, использовать
clientWidth,
scrollWidth или
offsetWidth. Разница между свойствами — границы области (
border-box,
padding-box и он же, но без учёта линеек прокрутки).
Написал, и задумался — а кому это надо?..