clientWidth:
- 只读属性 Element.clientWidth 对于内联元素以及没有 CSS 样式的元素为 0；否则，它是元素内部的宽度（以像素为单位）。该属性包括内边距（padding），但不包括边框（border）、外边距（margin）和垂直滚动条（如果存在）。
- 在根元素（<html> 元素）或怪异模式下的 <body> 元素上使用 clientHeight 时，该属性将返回视口宽度（不包含任何滚动条）
scrollWidth:
Element.scrollWidth 这个只读属性是元素内容宽度的一种度量，包括由于 overflow 溢出而在屏幕上不可见的内容。
scrollWidth值等于元素在不使用水平滚动条的情况下适合视口中的所有内容所需的最小宽度。宽度的测量方式与clientWidth相同：它包含元素的内边距，但不包括边框，外边距或垂直滚动条（如果存在）。它还可以包括伪元素的宽度，例如::before或::after。如果元素的内容可以适合而不需要水平滚动条，则其scrollWidth等于clientWidth
offsetWidth :
HTMLElement.offsetWidth 是一个只读属性，返回一个元素的布局宽度。一个典型的（译者注：各浏览器的 offsetWidth 可能有所不同）offsetWidth 是测量包含元素的边框 (border)、水平线上的内边距 (padding)、竖直方向滚动条 (scrollbar)（如果存在的话）、以及 CSS 设置的宽度 (width) 的值
以上定义来自mdn
clientWidth & scrollWidth 区别
父元素中的内容不需要水平滚动条，则其scrollWidth等于clientWidth
需要滚动条时：clientWidth 为实际内容（未被隐藏的内容）宽度，scrollWidth则会内容实际宽度，即加上已被隐藏的内容
三者区别：
clientWidth与offsetWidth 展示的都是可视内容宽度，区别是：offsetWidth包括border宽度
标签：滚动条,scrollWidth,元素,clientWidth,宽度,offsetWidth From： https://www.cnblogs.com/zry123/p/16976788.html