一、dom对象的距离
---dom.style.width : 对象本身的内容宽度（这里必须是内联样式中的width,带px）(content)
---dom.style.height:对象本身的内容高度（这里必须是内敛样式中的height,带px）(content)
---dom.clientWidth:对象本身的内容宽度+对象本身的内边距宽度（content+padding）
---dom.clientHeight:对象本身的内容高度+对象本身的内边距高度（content+padding）
---dom.scrollWidth:对象本身的内容宽度（包括溢出的宽度）+对象本身的内边距宽度（content+padding）
----dom.scrollHeight:对象本身的内容高度（包括溢出的高度）+对象本身的内边距高度（content+padding）
----dom.offsetWidth:对象本身占用的出外边距外的宽度（content+padding+border）
----dom.offsetHeight:对象本身占用的除外边距外的宽度（content+padding+border）
二、dom对象相对于其他元素的一些距离
----dom.offsetTop:对象自身相对于父级定位元素顶部的距离
----don.offsetLeft:对象自身相对于父级定位元素的左侧的距离
----dom.scrollTop:对象相对于文档的顶部高度
----dom.scrllLeft:对象相对于文档的左侧距离
三、事件对象相对于其他的元素的一些距离
----e.pageX:事件对象相对于文档的左上角的水平距离
----e.pageY:事件对象相对于文档的左上角的垂直距离
----e.clientX:事件对象相对于窗口的左上角的水平距离
----e.clientY:事件对象相对于窗口的左上角的垂直距离
----e.screenX:事件对象相对于电脑屏幕的左上角的水平距离
----e.screenY：事件对象相对于电脑屏幕的左上角的垂直距离
----e.offsetX（e.layerX）:事件对象相对于事件源的左上角的水平距离
----e.offsetY（e.layerY）:事件对象相对于事件源的左上角的垂直距离
原文地址：https://www.cnblogs.com/dhrwawa/p/10468760.html