offset、client、scroll三大系列

简介: offset、client、scroll三大系列

offset系列:4ff18c3a5dac483e80a86cdcc9bd9284.png

offsetWidth与style.width的区别:

2179f70e51f449fdab8a70d29a163dff.png

client系列:

ce95683dff954d678a88e63047d9759a.png

scroll系列:

b0c9887a7b2f42e38adebb2ba7aa825c.png

332f157949f64f3eb402e34e102c799e.png

注意:元素被卷去的头部是element.scrollTop,如果是页面被卷去的头部则是window.pageYoffset

三大系列总结:

1.offset系列经常用于获取元素位置 offsetLeft offsetTop

2.client系列经常用于获取元素大小 clientWidth clientHeight

3.scroll系列经常用于获取滚动距离 scrollTop scrollLeft

4.注意页面滚动的距离通过 window.pageXoffset 获得

5.滚动窗口至文档中的特定位置 window.scroll(x,y)(其中x与y不用加单位)


目录
相关文章
|
7月前
|
安全
qt.qpa.xcb: could not connect to display 问题解决
【5月更文挑战第16天】qt.qpa.xcb: could not connect to display qt.qpa.plugin: Could not load the Qt platform plugin "xcb" in "" even though it was found. This application failed to start because no Qt platform plugin could be initialized. Reinstalling the application may fix this problem. 问题解决
3311 0
|
消息中间件 Kafka 测试技术
Apache Kafka-auto.offset.reset参数(earliest、latest、none)含义说明
Apache Kafka-auto.offset.reset参数(earliest、latest、none)含义说明
360 0
|
JavaScript
js中offset、scroll、client三大系列
js中offset、scroll、client三大系列
133 0
js中offset、scroll、client三大系列
|
Web App开发 安全
Not allowed to navigate top frame to data URL
Not allowed to navigate top frame to data URL
327 0