有学有练才叫学习:学而不思则罔,思而不学则殆:学而不习,纸上谈兵,习而不进,画地为牢!

offsetwidth(offset、client、scroll三大家对比?)

javascript 炮渣日记 3周前 (11-17) 21次浏览 已收录 0个评论 扫描二维码
这三者都是获取大小和位置相关的属性,都有相应的left、top、width和height。

从位置上来对比:

offsetleft/offsetTop是相对于offsetParent的位置,offsetParent是具有定位属性的父级元素,如果父元素没有定位属性,继续向上查找,直到找到body。

clientLeft/clientTop获取的是自身左边框和上边框的宽度。

scrollLeft/scrollTop是获取左侧和顶部滚动隐藏进去的距离。

从大小上来对比:

offsetWidth/offsetHeight是获取元素在页面中占据的实际大小 ,offsetWidth/offsetHeight = width/height + padding + border。

clientWidth/clientHeight是获取元素的宽高 + 内边距clientWidth/clientHeight = width/height + padding。scrollWidth/scrollHeight是获取元素的宽高 + 内边距 + 未显示的内容,不包含滚动条,scrollWidth/scrollHeight = width/height + padding + 未显示内容 – 滚动条宽度

喜欢 (0)
炮渣日记
关于作者:
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址