js中offset、client、scroll【总结】
offset系列
offset动态的得到目标元素的位置(偏移)大小等
offset系列常用属性
offset系列属性 | 作用 |
---|---|
element.offsetParent | 返回作为该元素带有定位的父级元素 如果父级都没有定位则返回body |
element.offsetTop | 返回元素相对带有定位父元素上方的偏移 |
element.offset Left | 返回元素相对带有定位父元素左边框的偏移 |
element.offsetWidth | 返回自身包括padding、边框、内容区的宽度,返回数值不带单位 |
element.offsetHeight | 返回自身包括padding、边框、内容区的高度,返回数值不带单位 |
offset属性示意图
client系列:可视区
使用client系列的相关属性 获取元素可视区的相关信息
client常见属性
client系列属性 | 作用 |
---|---|
element.clientTop | 返回元素上边框的大小 |
element.clientLeft | 返回元素左边框的大小 |
element.clientWidth | 返回自身包括padding、内容区的宽度,不含边框,返回数值不带单位 |
element.clientHeight | 返回自身包括padding、内容区的高度,不含边框,返回数值不带单位 |
client属性示意图
scroll系列
scroll翻译过来就是滚动的,使用scroll系列的相关属性可以动态的得到该元素的大小、滚动距离等等
scroll系列常用属性
scroll系列属性 | 作用 |
---|---|
element.scrollTop | 返回被卷去的上侧距离,返回数值不带单位 |
element.scrollLeft | 返回被卷去的左侧距离,返回数值不带单位 |
element.scrollWidth | 返回自身实际的宽度,不含边框,返回数值不带单位 |
element.scrollHeight | 返回自身实际的高度,不含边框,返回数值不带单位 |
scroll属性示意图
js中offset、client、scroll【总结】相关推荐
- offset/client/scroll一些总结
offset/client/scroll一些总结 1.offset 首先offset共有五个值 1.offsetParent 2.offsetTop 3.offsetLeft 4.offsetWidt ...
- js中offset、client、scroll的区别
偏移量:offset dimension offsetHeight: 元素在垂直方向上占用的空间大小,以像素计.包括元素的高度.(可见的)水平滚动条的高度.上边框高度和下边框高度. offsetWid ...
- Web APIs介绍(四)——offset/client/scroll/轮播图/本地存储
1.1. 元素偏移量 offset 系列 1.1.1 offset 概述 offset 翻译过来就是偏移量, 我们使用 offset系列相关属性可以动态的得到该元素的位置(偏移).大小等. 获得元素距 ...
- offset client scroll
页面中所有标签都是元素(element),html标签是根元素,元素可看出是对象 页面中所有内容都是节点(node),所以标签.属性.文本都是节点,而文本包括文字回车换行空格 在DOM对象上有个 pr ...
- 三大系列总结(offset client scroll)
元素偏移量offset offset概述 获得元素距离带有定位父元素的位置 如果子元素没有父亲或者父元素没有定位,则以body为准 获得元素自身的大小(包含padding+border+width) ...
- 窗口和元素的大小:offset client scroll
1.偏移量(offset)只读 offsetHeight:元素垂直方向上占用的空间大小.包括元素内容区高度.元素上下内边距.(可见的)水平滚动条高度.上下边框高度 offsetWidth:元素水平方向 ...
- 原生JS中的三大家族(offset/scroll/client)与jQuery中对应的方法
JS中的offset家族: 一.offsetEWidth与offsetHeight: 获取的是元素的实际宽高 = width + border + padding 注意点: 1.可以获取行内及内嵌的宽 ...
- .net label在父容器中占两行显示_十分钟快速了解 JS 中的 offset、scroll、client
经常碰到offset.scroll.client这几个关键字,每次都要各种实验,这里总结一下. 两张图镇楼,随时翻阅 1. offset offset 指偏移,包括这个元素在文档中占用的所有显示宽度, ...
- extjs中滚动条属性_十分钟快速了解 JS 中的 offset、scroll、client
(给前端大全加星标,提升前端技能) 作者:前端下午茶 公号 / SHERlocked93 在下开发中经常碰到 offset.scroll.client 这几个关键字,比如 offsetLeft.of ...
最新文章
- 回归——同步更新github.io
- nginx服务器的负载均衡和动静分离(未完)
- 浏览器崩溃时提示137错误
- 蓝桥杯-安慰奶牛(java)
- Android Studio新建类头部注释和添加函数注释模板及快捷键
- 进度条设置_项目功能分解4:MATLAB GUI如何设计有特色的进度条。
- Browser控制台分析
- 全国计算机等级考试题库二级C操作题100套(第18套)
- .NET Core dotnet 命令大全
- Xftp远程连接出现“无法显示文件夹”的问题补充
- 小米4刷CM13系统
- python输入名字配对情侣网名_输入姓名配对qq网名,QQ情侣昵称
- CentOS 使用spawn-fcgi配置Nginx+PHP 启动脚本
- tomcat后台密码爆破脚本(python+字典)_Web中间件漏洞之Tomcat篇
- mysql用utf-8_切记:永远不要在MySQL中使用UTF-8
- 将ttc改为otf_几种字体格式的区别otf/ttf/ttc格式字体的区别
- 随机森林 Iris 特征重要性
- 关于键盘方向键的ASCII的问题解释
- 谷歌tts android手机自带引擎,自动下载android TTS引擎
- MySQL数据库——SQL函数
热门文章
- 一加7Tpro刷鸿蒙,稀缺全面屏旗舰手机一加7T Pro 再不买真就没了
- 斯坦福CS234增强学习——(1)简介
- java——集合——List集合——List集合
- https安全传输揭秘 1
- 离谱,还有这种自暴自弃的翻译?
- 计算机怎么消除用户密码,电脑开机设置了密码要怎么删除
- 鲸鱼算法优化PID参数优化附matlab代码
- 2021年第四届“传智杯“大学B组
- Cell Genomics封面|北大吴华君组利用空间多组学技术解析肿瘤内空间异质性(附招聘)...
- python逻辑回归的主要参数_python机器学习(六)回归算法-逻辑回归