这篇文字主要一下三方面内容：一、javascript获取事件位置；二、Javascript获取dom对象位置；三、Javascript获取绝对坐标；四、浏览器相对桌面位置
有段时间没更新博客了，工作实在太忙了，加班加班再加班就是我们这个行业的常态吧、、、还好最近把工作进度完成了，终于有些空余时间了。关于《Javascript高级程序设计》系列，我并没有弃坑，只不过最近在把这本书读第二遍，主要针对一些第一遍没看懂的部分，完成之后我会继续更新的。
这篇文字主要一下三方面内容：
一、javascript获取事件位置
二、Javascript获取dom对象位置
三、Javascript获取绝对坐标
四、浏览器相对桌面位置
一、javascript获取事件位置
首先上图，这个图片是我在网上找到的，感觉做的比较好！
事件的位置主要涉及clientX,clientY,screenX,screenY,offsetX,offsetY 。
1.1 offsetX,offsetY
鼠标相对于事件源元素（srcElement）的X,Y坐标。
1.2 event.screenX、event.screenY
鼠标相对于用户显示器屏幕左上角的X,Y坐标。标准事件和IE事件都定义了这2个属性
1.3 event.clientX、event.clientY
鼠标相对于浏览器窗口可视区域的X，Y坐标（窗口坐标），可视区域不包括工具栏和滚动条。标准事件和IE事件都定义了这2个属性。
二、Javascript获取dom对象位置
关于clientWidth offsetWidth scrollWidth 等的含义
offsetWidth(width+padding+border)
当前对象的宽度。
style.width也是当前对象的宽度(width+padding+border)。
区别：
1)style.width返回值除了数字外还带有单位px；
2)如对象的宽度设定值为百分比宽度,则无论页面变大还是变小，style.width都返回此百分比,而offsetWidth则返回在不同页面中对象的宽度值而不是百分比值；
3)如果没有给 HTML 元素指定过 width样式，则 style.width 返回的是空字符串；
offsetHeight :(Height+padding+border)
当前对象的高度。
style.height也是当前对象的高度(height+padding+border)。
区别：
1)style.height返回值除了数字外还带有单位px；
2)如对象的高度设定值为百分比高度,则无论页面变高还是变矮，style.height都返回此百分比,而offsetHeight则返回在不同页面中对象的高度值而不是百分比值；
3)如果没有给 HTML 元素指定过 height样式，则 style.height返回的是空字符串；
clientWidth: 获取对象可见内容的宽度，不包括滚动条，不包括边框；
clientHeight: 获取对象可见内容的高度，不包括滚动条，不包括边框；
三、Javascript获取绝对坐标
直接获取页面元素绝对位置的js函数
var p = $("#DoSum");
var offset = p.offset();
alert(offset.left);
alert(offset.top);
//获取元素的纵坐标
function getTop(e){
var offset=e.offsetTop;
if(e.offsetParent!=null) offset+=getTop(e.offsetParent);
return offset;
}
//获取元素的横坐标
function getLeft(e){
var offset=e.offsetLeft;
if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);
return offset;
}还有getBoundingClientRect(),这个也可以获得绝对坐标
x=oRect.left
y=oRect.top
四、浏览器相对桌面位置
clientWidth是对象看到的宽度（不含边线,即border）
scrollWidth是对象实际内容的宽度（若无padding，那就是边框之间距离，如有padding，就是左padding和右padding之间距离）。
offsetWidth是指对象自身的宽度，整型，单位像素（含边线，如滚动条的占用的宽，值会随着内容的输入而不断改变）。
clientWidth: 获取对象可见内容的宽度，不包括滚动条，不包括边框；
clientHeight: 获取对象可见内容的高度，不包括滚动条，不包括边框；
