鼠标事件以及clientX、offsetX、screenX、pageX、x的区别

来源：https://blog.csdn.net/weixin_41342585/article/details/80659736

SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。

图片来源：https://www.cnblogs.com/deerfig/p/6432683.html

　　　　　// content
        $('.demo1').width()
        // content+padding
        $('.demo1').innerWidth();//200+100*2
        // content+padding+border
        $('.demo1').outerWidth();//200+100*2+5*2
        // content+padding+border+margin
        $('.demo1').outerWidth(true);//200+100*2+5*2+5*2
height同理。
一下图片转自：https://www.imooc.com/article/17571

"clientHeight": content + padding,(注：对于inline的元素这个属性一直是0，单位px，只读元素。) "offsetHeight": content + padding + border + 水平滚动条宽度,（对于inline的元素这个属性一直是0，单位px，只读元素。） "scrollHeight":  "scrollTop": 

 "offsetTop"

 

网页可见区域高：document.body.clientHeight

网页正文全文高：document.body.scrollHeight
网页可见区域高（包括边线的高）：document.body.offsetHeight
网页被卷去的高：document.body.scrollTop

屏幕分辨率高：window.screen.height

 

 

扫码关注我们

微信号：SRE实战

拒绝背锅 运筹帷幄