js获取页面元素位置的方法getBoundingClientRect()

作用

getBoundingClientRect()是用来获取页面元素的位置的方法.这个方法最终返回的是一个矩形对象,包括四个属性:left,top,bottom,right

四个属性

  1. top:元素上边到视窗上边的距离;
  2. right:元素右边到视窗左边的距离;
  3. bottom:元素下边到视窗上边的距离;
  4. left:元素左边到视窗左边的距离;
  5. width:边界矩形的宽度(ie9)
  6. height:边界矩形的高度(ie9js获取页面元素位置的方法getBoundingClientRect()
    )

注意:当我提到元素的边界矩形的时候,返回的大小包含了任何padding和border值。getBoundingClientRect()可以精确获取到保留小数点!