offset系列scroll系列 client系列总结
2019-01-16 21:11
162 查看
offset系列:偏移量;带边框的值;返回值为数字类型,要加px
offsetLeft:向左偏移,边框到边框的距离,margin+border
offsetTop:/offsetWidth:offsetHeight:
当父元素,子元素都没有脱离文档流时 offsetLeft为父盒子margin + 父padding + 父border + 子margin
当父盒子脱离文档流,这时子盒子无论脱不脱离文档流 offsetLeft的值 只等于子盒子的margin
(当父子的父盒子脱离文档流,父盒子有margin 这时 子盒子会继承margin)
scroll系列
scrollWidth:元素中内容实际的宽度
scrollHeight:元素中内容实际的高度
scrollTop:元素向上卷曲出去的距离
scrollLeft:元素向左卷曲出去的距离
//几种获取巻取值得方式
window.pageXOffset //ie8老版本不支持
document.documentElement.scrollLeft //ie支持
document.body.scrollLeft; //ie8支持
//获取元素
document.body //获取body中的内容 不包括head
document.documentElement//获取的是所有内容 包括head
docuemnt.title 获得title文本对象
3,client系列
可是区域
clientWidth:可是区域的宽,不包括边框,是内部的宽高
clientHeight:可是区域的高,不包括边框,是边框的内部
clientLeft:左边框的宽度
clientTop上边框的宽度
clientX:可视区域的横坐标
相关文章推荐
- offset系列、client系列、scroll系列的属性
- 总结scrollLeft,offsetLeft,clientLeft等属性
- 差别client、offset、scroll系列以及event的几个距离属性
- DOM获取元素位置的三大系列offset/scroll/client
- javascript中offset、client、scroll的属性总结
- 使用JS,JQ获取offset-*,client-*,scroll-*的方法总结
- 随笔:offset、client、scroll的小总结
- offset/client/scroll一些总结
- JavaScript中的三大系列offset、client、scroll
- offset、client、scroll开头的属性归纳总结
- 区分总结innerHeight与clientHeight、innerWidth与clientWidth、scrollLeft与pageXOffset等属性
- 区别client、offset、scroll系列以及event的几个距离属性
- javascript中top、clientTop、scrollTop、offsetTop的讲解(转载加总结)
- offset、client、scroll开头的属性归纳总结
- 16-client、offset、scroll系列
- javascript中offset、client、scroll的属性总结
- HTML:scrollLeft,scrollWidth,clientWidth,offsetWidth到底指的哪到哪的距离之完全详解
- scrollLeft,scrollWidth,clientWidth,offsetWidth到底指的哪到哪的距离
- JS中关于clientWidth offsetWidth scrollWidth 等的含义