卖坚果的怪叔叔 卖坚果的怪叔叔
  • 首页
  • 生活
  • 技术
  • 记录
  • 工具箱
  • 关于我
首页 › 技术 › js中的各种width,height

js中的各种width,height

坚果大叔
2018-10-10 10:36:51技术阅读 3,183
默认系列
offsetWidth      //返回元素的宽度(包括元素宽度、内边距和边框,不包括外边距)
offsetHeight     //返回元素的高度(包括元素高度、内边距和边框,不包括外边距)
clientWidth      //返回元素的宽度(包括元素宽度、内边距,不包括边框和外边距)
clientHeight     //返回元素的高度(包括元素高度、内边距,不包括边框和外边距)
style.width      //返回元素的宽度(包括元素宽度,不包括内边距、边框和外边距)
style.height     //返回元素的高度(包括元素高度,不包括内边距、边框和外边距)
scrollWidth      
//返回元素的宽度(包括元素宽度、内边距和溢出尺寸,不包括边框和外边距),无溢出的情况,与clientWidth相同
scrollHeigh      
//返回元素的高度(包括元素高度、内边距和溢出尺寸,不包括边框和外边距),无溢出的情况,与clientHeight相同
垂直滚动
offsetTop
// 返回元素的上外缘距离最近采用定位父元素内壁的距离,如果父元素中没有采用定位的,则是获取上外边缘距离文档内壁的距离。所谓的定位就是position属性值为relative、absolute或者fixed。返回值是一个整数,单位是像素。此属性是只读的。
offsetLeft
//此属性和offsetTop的原理是一样的,只不过方位不同,这里就不多介绍了。
scrollLeft
//此属性可以获取或者设置对象的最左边到对象在当前窗口显示的范围内的左边的距离,也就是元素被滚动条向左拉动的距离。返回值是一个整数,单位是像素。此属性是可读写的。
scrollTop
//此属性可以获取或者设置对象的最顶部到对象在当前窗口显示的范围内的顶边的距离,也就是元素滚动条被向下拉动的距离。返回值是一个整数,单位是像素。此属性是可读写的。
当鼠标事件发生时(不管是onclick,还是omousemove,onmouseover等)
clientX      鼠标相对于浏览器(这里说的是浏览器的有效区域)左上角x轴的坐标;不随滚动条滚动而改变;
clientY      鼠标相对于浏览器(这里说的是浏览器的有效区域)左上角y轴的坐标;不随滚动条滚动而改变;
pageX        鼠标相对于浏览器(这里说的是浏览器的有效区域)左上角x轴的坐标;随滚动条滚动而改变;
pageY        鼠标相对于浏览器(这里说的是浏览器的有效区域)左上角y轴的坐标;随滚动条滚动而改变;
screenX      鼠标相对于显示器屏幕左上角x轴的坐标;
screenY      鼠标相对于显示器屏幕左上角y轴的坐标;
offsetX      鼠标相对于事件源左上角X轴的坐标
offsetY      鼠标相对于事件源左上角Y轴的坐标
height JavaScript width
赞赏 赞(0)
本文系作者 @坚果大叔 原创发布在 卖坚果的怪叔叔。未经许可,禁止转载。
国庆放假中。
上一篇
history对象和HTML5 History API
下一篇
在小程序中查看

这是个😊,挣点服务器费用😜

热门文章
上海九院口腔囊肿手术小记
uni 小程序 vendor 体积过大。
前端每日两三问(20190923)
小程序云开发实现订阅消息推送!
自驾太湖龙之梦动物世界~
超简单!只需简单几步即可为TA定制天气小助理!!
专题标签
agent (1) CSS (15) dom (1) Es6入门系列 (14) Git (3) html (1) iview (1) JavaScript (9) js (4) Lif (1) Node (4) pyecharts (1) Python (10) ref (1) scriptable (1) Skill (1) vsCode (1) vue (4) wordpress (2) 三月 (1) 上海 (1) 假期 (1) 其他分享 (3) 前端两三问 (15) 古镇 (1) 外滩 (1) 对象 (1) 小程序 (5) 年度总结 (6) 年终总结 (1) 微信机器人 (4) 打字机 (1) 技术 (1) 日常问题 (8) 日常问题记录 (1) 春天 (2) 服务器 (2) 海族馆 (1) 生活 (8) 网上国网 (1) 记录 (3) 通勤 (1) 重学JavaScript (11) 面试题 (10) 🌸 (1)
什么是Agent?
2026-08-15 23:49:12
385 0 2
什么是 Skill?
2026-08-12 21:32:42
322 1 0
失业在家,我给小朋友做了一个练字小程序!
2026-08-07 16:21:52
589 10 1
上线8年,15万用户的小程序,一共赚了多少钱?
2026-05-30 18:01:24
4,635 4 0
  • 0
博主

一位佛系的前端开发者,略通摄影,乐于尝试新事物,热衷于美食。

友链
故事胶片
公众号
坚果大叔 执行上下文 卖坚果的怪叔叔 Dacking
Copyright © 2017-2026 卖坚果的怪叔叔

开往-友链接力

萌ICP备20230818号

苏ICP备18048410号-3
  • 首页
  • 生活
  • 技术
  • 记录
  • 工具箱
  • 关于我
# CSS # # JavaScript # # vue # # 微信 # # 生活 #
坚果大叔
345
文章
171
评论
432
喜欢