getBoundingClientRect

getBoundingClientRect获取元素位置

是DOM元素到浏览器可视范围的距离（不包含文档卷起的部分）。 
该函数返回一个Object对象，该对象有6个属性：top,lef,right,bottom,width,height； 

1.语法 var  rectObject = object.getBoundingClientRect();

2.返回值类型

rectObject.top：元素上边到视窗上边的距离;

rectObject.right：元素右边到视窗左边的距离;

rectObject.bottom：元素下边到视窗上边的距离;

rectObject.left：元素左边到视窗左边的距离;

3. 兼容性：ie5以上都能支持。

PC端:

Mobile端:

注意：IE、Firefox3+、Opera9.5、Chrome、Safari支持，在IE中，默认坐标从(2,2)开始计算，导致最终距离比其他浏览器多出两个像素，我们需要做个兼容。

document.documentElement.clientTop;  // 非IE为0，IE为2document.documentElement.clientLeft; // 非IE为0，IE为2functiongGetRect (element) {var rect = element.getBoundingClientRect();var top = document.documentElement.clientTop;var left= document.documentElement.clientLeft;return{top    :   rect.top - top,bottom :   rect.bottom - top,left   :   rect.left - left,right  :   rect.right - left}
}