clientWidth & clientHeight 客户宽高(元素的width+padding)
offsetWidth & offsetHeight 偏移宽高 (元素的width+pading+border)即元素实际大小,只与元素设定的width,height,padding,border 有关
scrollWidth & scrollHeight 滚动宽高 (元素的width+padding)如果元素内容超出容器,出现滚动条,则代表元素内所有内容的宽高 scrollWidth 和 clientWidth的值相同
没有滚动条时图解

有滚动条时

clientLeft &clientTop 元素边框线的宽高
offsetLeft &offsetTop 元素有定位时,元素相对于包含块左上角的位置 (该值等同于CSS中定位的 left 和 top 值)
元素无定位时,元素相对于页面左上角的位置
scrollLeft & scrollTop 元素超出容器时,元素顶部相对页面顶部的距离(拉动滚动条时,元素内容卷起部分的宽高)
如果没有超出容器(即没有滚动条时)该值为0

浙公网安备 33010602011771号