JS之dom元素和位置有关的属性计算方式
以下全部属性皆为横向(因为竖向的话只需要把x改为y即可,就不在本文列出)
1.clientWidth:元素内部宽度 =width+padding
2.offsetWidth:元素内部宽度=width+padding+border+scroll
3.clientLeft:元素左边框的宽度
4.offsetLeft:元素左边框与定位的父级元素的距离
注意:父元素需要有定位,就是position需要有值,如果父元素没有定位,则会继续往上层元素找到有定位的元素
5.clientX:鼠标相对于浏览器窗口可视化的x坐标
6.offsetX:鼠标相对于事件源的x坐标
7.pageX:鼠标相对于文档的x坐标,而非窗口坐标
注意:会计算滚动距离,如果没有滚动距离,则跟clientX是一样的
8.screenX:鼠标相对于显示器左侧位置的x坐标(把浏览器往左边移动能看出效果)
分类:
#个人成长
标签:
JavaScript
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」