clientY pageY screenY layerY offsetY的区别

• clientX和clientY与x，y一样：以浏览器显示区域的左上角开始，指鼠标的坐标。x,y是新浏览器支持
• pageX，pageY：相对页面左上角的距离(不受页面滚动影响,即加上滚动轴滚动的距离)
• offsetX，offsetY：针对自己的左上角坐标，从padding开始。
• layerX，layerY：往上找有定位属性的父元素的左上角（自身有定位属性的话就是相对于自身），都没有的话，就是相对于body的左上角
• screenX，screenY：相对屏幕左上角的位置

	相同点	不同点
clientY	距离页面左上角距离	受页面滚动的影响
pageY	距离页面左上角的距离	不受页面滚动影响

layerY：父: position: relative; 子: position:absolute;

	相同点	不同点
layerY	距离元素的左上角距离	受元素的定位的影响，会从本元素往上找到第一个定位的元素的左上角
offsetY	距离元素左上角的距离	计算相对于本元素的左上角，不在乎定位问题，计算的是内交点。是IE浏览器的特有属性

其他：

• clientWidth，clientHeight：这两个属性可以获取元素的可见宽度和高度，会获取元素宽度和高度，包括内容区和内边距

• offsetWidth，offsetHeight：获取元素的整个的宽度和高度，包括内容区、内边距和边框

• offsetParent：可以用来获取当前元素的定位父元素的定位（开启了定位的祖先元素），没有开启定位，则返回body

• offsetLeft，offsetTop：当前元素相对于其定位父元素的水平和垂直偏移量

• scrollWidth，scrollHeight：可以获取元素整个滚动区域的宽度和高度

• scrollLeft，scrollTop：可以获取水平和垂直滚动条滚动的距离

• scrollHeight - scrollTop == clientHeight

• scrollWidth - scrollLeft == clientWidth

div的偏移量 鼠标.clentX - 元素.offsetLeft

div的偏移量 鼠标.clentY - 元素.offsetTop