offset、scroll、client三大家族

1、offset    偏移

1、offsetWidth 和 offsetHeight 是用来得到对象的大小，由自身宽高内边距边框构成但是不包括外边距

offsetHeight和style.height的区别

1> style.height只能获取行内样式，offsetHeight可以获取行内样式和内嵌样式

2> style.height是字符串（而且带单位），offsetHeight是数值

3> style.height可读可写，offsetHeight是只读属性

2、offsetLeft 和 offsetTop 用来得到对象的位置，到距离自身最近的（带有定位的）父元素的左侧/顶部的距离，如果所有父级都没有定位则以body 为准

offsetLeft和style.left的区别

1> style.left只能获取行内样式，offsetLeft 可以获取行内样式和内嵌样式

2> offsetLeft 只读，style.left可读可写

3> offsetLeft是数值，style.left是字符串并且有单位px

4> 如果没有加定位，style.left获取的数值可能是无效的

5> 最大区别在于offsetLeft以border左上角为基准，style.left以margin左上角为基准

2、scroll         滚动

1、scrollHeight和scrollWidth 对象内部实际内容的高度/宽度，包括内容区和内边距，不包括边框

2、scrollTop和scrollLeft 被卷去部分的顶部/左侧到可视区域顶部/左侧的距离

3、client   可视区、客户端

1、clientWidth和clientHeight 包括内容区和内边距，不包括边框

2、clientTop和clientLeft 几乎不用，因为滚动条不会在顶部和左侧

offset、scroll、client三大家族相关推荐

dom操作获取盒子宽高位置的三种方法,offset/scroll/client三大家族使用详解(附源码及注释)
结论:页面body的高度==视口的高度+滚动条滚动的距离. 这是一个恒等式,看完本篇博客,你将了解offset/scroll/clent三大事件获取宽高位置的具体含义,运用所学内容可以推导出这样的恒等 ...
js 三大家族（offset/scroll/client）
<!DOCTYPE html> <html> <head lang="en"><meta charset="UTF-8" ...
js的三大家族(offset/scroll/client)和一个事件对象(event)///正则
一 offset 第1章 offset家族 4 1.1 三大家族和一个事件对象 4 1.2 Offset家族简介 4 1.2.1 offsetWidth和offsetHi ...
原生JS中的三大家族（offset/scroll/client）与jQuery中对应的方法
JS中的offset家族: 一.offsetEWidth与offsetHeight: 获取的是元素的实际宽高 = width + border + padding 注意点: 1.可以获取行内及内嵌的宽 ...
DOM获取元素位置的三大系列offset/scroll/client
2019独角兽企业重金招聘Python工程师标准>>> 我们使用元素.style.left在style标签中设置的样式的值都获取不到. 现在就说一下三大系列吧,首先明确documen ...
offset;scroll;client
DOM元素对象的属性/方法之offset(Height,Width,Left,Parent,Top);scroll(Height,Width,Left,Top);client(Height,Width ...
三大家族scroll、offset、client
三大家族scroll.offset.client JS的三大家族主要是Offset.Scroll.Client,通过对三大家族不同属性的灵活使用,我们可以模拟出很多炫酷的JS动画,增强界面的视觉感染力 ...
BOM对象及offset、client、scroll三大家族
文章目录 BOM对象 1. location 对象 location 对象的常用属性案例 location对象的常见方法 2. navigator对象 3.history对象 history对象常 ...
javaScript中三大家族总结
三大家族整体解释图第一大家族:offset家族 offset 是自己的-- 目的: 方便的获取元素尺寸 offsetWidth offsetHeight 得到对象的宽度和高度(自己的,与他人无关) ...

offset、scroll、client三大家族

offset、scroll、client三大家族相关推荐

最新文章

热门文章