getBoundingClientRect()

1、语法

var rect=el.getBoundingClientRect();

2、返回值

返回一个包含left、top、right、bottom、width、height值的矩形对象。

注：
width和height：ie9及以上支持width/height属性。
兼容ie6~ie8的width/height的写法：

return{    width:rect.right-rect.left,    height:rect.bottom-rect.top}

3、 兼容性

pc端：

移动端：

（图片及文章参考：http://www.cnblogs.com/Songyc/p/4458570.html）

在ie7及ie7以下的html元素坐标会从(2, 2)开始算起，所以在ie7及ie7以下left和top会多出两个像素。
用 document.documentElement.clientLeft 和 document.documentElement.clientTop 做兼容
（ie7及以下document.documentElement.clientLeft = document.documentElement.clientTop=2，
而ie8及以上 document.documentElement.clientLeft = document.documentElement.clientTop=0）

完整兼容写法如下：

function getRect(el){    var rect=el.getBoundingClientRect();    var _left=document.documentElement.clientLeft;    var _top=document.documentElement.clientTop;    return{        left:rect.left-_left,        top:rect.top-_top,        right:rect.right-_left,        bottom:rect.bottom-_top,        width:rect.right-rect.left,        height:rect.bottom-rect.top    }}