这个代码什么意思啊？

Question

var x, y;
            var e = e || window.event;
            return {
                x: e.clientX + $('body').scrollLeft() + $(document).scrollLeft(),
                y: e.clientY + $('body').scrollTop() + $(document).scrollTop()
            };这是jquery下的插件的一段代码，其中
 x: e.clientX + $('body').scrollLeft() + $(document).scrollLeft(),
这个是什么意思
e.clientX 是元素到屏幕左边的距离
$('body').scrollLeft() 是横向滚动条的左边与屏幕左边的距离
那e.clientX+$('body').scrollLeft()就应该是元素到文档左边整个的距离了
我理解的对吗？但是这时候，再加上$(document).scrollLeft()，
x: e.clientX + $('body').scrollLeft() + $(document).scrollLeft(),
他们三个相加是啥什么意思呢？

Answer 1

$('body').scrollLeft()距离左侧（document）偏移量
$(document).scrollLeft() 距离左侧（window）偏移量
一般用一个css来设置这两个边距为0
html,body{
margin:0 0 0 0;
padding:0 0 0 0;
}

Answer 2

$.scrollLeft() 是相对于滚动条左侧的偏移实际中, e.clientX + document.scrollLeft()在多数情况下就可以得到相对于逻辑原点准确的点击位置了. body是一个逻辑定义. 并不代表页面的全部. $(document)才是这个页面. +$('body').scrollLeft()是为了某些差异的修正. 
lz可以在任意页面试试
alert($(document).scrollLeft() + ', ' + $('body').scrollLeft() + ', ' + e.clientX)

Answer 3

多数情况下document与body的偏移为0

Answer 4

document有document的滚动条
body有body的滚动条。
我们一般看到的滚动条是ducoument的滚动条。
当然也有可能会隐藏document的滚动条，而显示body的滚动条。
如下代码就会显示body的滚动条
 html {overflow: hidden}
 body {overflow: scroll; height: 100%}