clientWidth clientHeight offsetWidth offsetHeight

 

 

<!--
一 :不包含border大小
clientWidth width + padding 元素的宽度 + 左右padding的宽度(不包含border)
clientHeight height + padding 元素的高度 + 上下padding的高度(不包含border)
clientLeft border 的大小 (如boder: 3px solid #000 那么clientLeft,clientTop === 3)
clientTop border 的大小 (如boder: 3px solid #000 那么clientLeft,clientTop === 3)


二:包含border大小
offsetWidth width + padding + border 元素的宽度 + 左右padding的宽度 + boder
offsetHeight height + padding + border 元素的高度 + 上下padding的高度 + boder

offsetLeft 当前元素 左边框 外边缘 到 最近的已定位父级(offsetParent)左边框 内边缘的距离。
如果父级都没有定位,则分别是到body 顶部 和左边的距离

offsetTop 当前元素 上边框 外边缘 到 最近的已定位父级(offsetParent) 上边框 内边缘的 距离。
如果父级都没有定位,则分别是到body 顶部 和左边的距离

三:不包含border大小
scrollWidth width + padding 元素的宽度 + 左右padding的宽度(不包含border)
scrollHeight height + padding 元素的高度 + 上下padding的高度(不包含border)
-->
 
posted @ 2021-05-07 16:12  javascript9527  阅读(75)  评论(0编辑  收藏  举报