获取DOM元素尺寸及鼠标位置

本文介绍了如何通过JavaScript获取网页元素的各种尺寸,包括clientWidth/clientHeight、offsetWidth/offsetHeight等,并探讨了如何获取鼠标在页面上的位置。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

**获取元素尺寸:**
clientWidth/clientHeight:
*获取元素自身宽高,增加滚动条或增加padding都会影响自身宽高。*
offsetWidth/offsetHeight:
获取元素实际大小(最好是block元素且设置了宽高),只有padding会影响这个值。
scrollWidth/scrollHeight:
获得元素内容的宽高(可以将内容溢出测试)。
offsetParent :
获取父元素节点(IE7及以下比支持)
offsetLeft/offsetTop:
获取元素相对于父元素左边/顶部的距离(最好将元素使用绝对定位,不然IE低版本会出错)
scrollTop/scrollLeft:
获取页面滚出去的长度
clientTop/clientLeft:
获取元素上边框和左边框的宽度
**获取鼠标位置**
clientX,clientY,获取鼠标在可视区域中的坐标(和页面长度无关);
screenX,screenY,获取鼠标相对于电脑屏幕左边和上边的坐标;
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值