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不用加单位)


目录
相关文章
|
消息中间件 Kafka 测试技术
Apache Kafka-auto.offset.reset参数(earliest、latest、none)含义说明
Apache Kafka-auto.offset.reset参数(earliest、latest、none)含义说明
342 0
|
Java 应用服务中间件 Python
Refused to display 'xxx' in a frame ,because it set 'X-Frame-Options' to 'deny'.
我本是在DJANGO页面的iframe里嵌入springboot的页面。 当报了这个错误之后,我花了时间在nginx和django上, 后来才改变解决思路,从springboot出发,解决问题。
5838 0
|
JavaScript
js中offset、scroll、client三大系列
js中offset、scroll、client三大系列
129 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
323 0
|
存储 Web App开发 缓存
Client Side Cache 和 Server Side Cache 的区别
Client Side Cache 和 Server Side Cache 的区别
166 0
Client Side Cache 和 Server Side Cache 的区别