Get Width and Height of an Element

To get the width and height of an element, you use the offsetWidth and offsetHeight properties of the element:

const box = document.querySelector('.box');

const width = box.offsetWidth,
    height = box.offsetHeight;

The offsetWidth and offsetHeight includes the padding and border.

To get the width and height of an element without the border, you use the clientWidth and clientHeight properties:

const box = document.querySelector('.box');

const width = box.clientWidth,
    height = box.clientHeight;

Note that the clientWidth and clientHeight properties also include the paddings.

Source