html元素中client、offset、scroll所表达的含义

个人理解

client（当事人）为该元素盒子中的取值

offset（偏移）为元素相对于浏览器的取值

scroll（滚动）为元素算入滚动部分的真实取值

示例说明

client系列

clientWidth / clientHeight : 内容的宽度 / 高度 + 左右 / 上下填充padding clientLeft / clientTop : 左边框的宽度 / 上边框的高度

offset系列

offsetWidth / offsetHeight : clientWidth / clientHeight + 左右 / 上下边框border offsetParent：当前元素的富集参照物 offsetLeft / offsetTop：当前元素的外边框距离富集参照物的内边框的偏移量

scroll系列

scrollWidth / scrollHeight ：和我们的clientWidth / clientHeight 一模一样 如果容器中的内容有溢出，我们获取的结果是如下规则： 　scrollWidth ：真实内容的宽度（包含溢出） + 左填充padding-left 　scrollHeight：真实内容的高度（包含溢出） + 上填充padding-top scrollLeft / scrollTop：滚动条卷去的宽度 / 高度