元素尺寸 - Githubissues

dashengzi66 / note

学习笔记

0 stars 0 forks source link

元素尺寸 #16

Open dashengzi66 opened 3 years ago

dashengzi66 commented 3 years ago

偏移尺寸

offsetHeight：，元素在垂直方向上占用的像素尺寸，包括它的高度、水平滚动条高度（如果可见）和上、下边框的高度。
offsetLeft：元素左边框外侧距离包含元素左边框内侧的像素数。
offsetTop：元素上边框外侧距离包含元素上边框内侧的像素数。
offsetWidth：元素在水平方向上占用的像素尺寸，包括它的宽度、垂直滚动条宽度（如果可见）和左、右边框的宽度。

offsetLeft 和 offsetTop 是相对于包含元素的，包含元素保存在 offsetParent 属性中。offsetParent 不一定是 parentNode。比如，td元素的 offsetParent 是作为其祖先的table元素，因为table是节点层级中第一个提供尺寸的元素

dashengzi66 commented 3 years ago

客户端尺寸

元素的客户端尺寸（client dimensions）包含元素内容及其内边距所占用的空间。客户端尺寸只有两个相关属性：clientWidth 和 clientHeight。其中，clientWidth 是内容区宽度加左、右内边距宽度，clientHeight 是内容区高度加上、下内边距高度。

客户端尺寸实际上就是元素内部的空间，因此不包含滚动条占用的空间。这两个属性最常用于确定浏览器视口尺寸，即检测 document.documentElement 的 clientWidth 和 clientHeight。这两个属性表示视口（或元素）的尺寸。

dashengzi66 commented 3 years ago

滚动尺寸

scrollHeight：没有滚动条出现时，元素内容的总高度
scrollLeft：内容区左侧隐藏的像素数，设置这个属性可以改变元素的滚动位置
scrollTop：内容区顶部隐藏的像素数，设置这个属性可以改变元素的滚动位置
scrollWidth：没有滚动条出现时，元素内容的总宽度