Changing Styles Dynamically

const rect = element.getBoundingClientRect();
element.style.width = rect.width + 'px';
element.style.height = rect.height + 'px';

Using element.offsetWidth/Height
Using element.clientWidth/Height
Using getBoundingClientRect()
All of the above
All these methods can be used to get element dimensions, but they serve different purposes. getBoundingClientRect() provides the most comprehensive information including position relative to viewport. offsetWidth/Height includes padding and borders. clientWidth/Height includes padding but not borders. Choose based on whether you need the content box, padding box, or border box measurements.