js获取dom元素宽高
一,前言1.对于css盒子模型,我们使用width和height等来定义dom元素的宽高,而有时我们需要在js中获取元素的宽高进行一些操作。2.dom操作提供了相应的属性来实现这一点二,clientWidth和clientHeight1.clientWidth和clientHeight用于获取元素的视口宽高,不包含border,margin,还要滚动条。三,offsetWidth和offsetHe
·
一,前言
1.对于css
盒子模型,我们使用width
和height
等来定义dom
元素的宽高,而有时我们需要在js
中获取元素的宽高进行一些操作。
2.dom
操作提供了相应的属性来实现这一点
二,clientWidth
和clientHeight
1.clientWidth
和clientHeight
用于获取元素的视口宽高,不包含border
,margin
,还要滚动条。
三,offsetWidth
和offsetHeight
1.元素的实际宽高,包含滚动条和border
,不包含margin
四,scrollHeight
和scrollWidth
1.当一个元素出现滚动时,这个元素的clientWidth
和clientHeight
表示了元素的视口宽高,而scrollHeight
和scrollWidth
用于表示该元素的滚动的实际宽高。
2,如图红色元素的scrollHeight
的值是黑色线段的长度。
3.也可以看出此时蓝色元素的offsetHeight
= 红色元素的scrollHeight
五,scrollTop
1.出现滚动条的元素,滚动距离上边界的距离。
2.如下图,红色的元素的scrollTop
等于绿色线段的长度。
3.scrollTop
是可以修改的,修改时蓝色元素移动到相应位置
更多推荐
已为社区贡献5条内容
所有评论(0)