1.有滚动条的控件的距离：
scrollTop和scrollLeft：分别指有滚动条的容器控件的滚动条的top和left；页面滚动条的通用取法：document.body.scrollTop（FF\CHROM） || document.documentElement.scrollTop(IE);
当然了，你要非想给没滚动条的控件加scrollTop，也不报错，就是0；
2.DOM控件的距离：
offsetTop和offsetLeft：指标签对应父级的绝对Top和Left;
offsetWidth和offsetHeight：算出控件的绝对宽度和绝对高度，就是控件宽加边框宽。火狐是一个很奇葩的浏览器，加了border的div等控件，总是把border给缩水那么0.几几，所以不要随便用边框啊。
3.事件的距离
clientX和clientY:指在能发生事件的范围内所发生事件的焦点相对于该范围的横纵距离。
clientWidth和clientHeight：指诱导该事件发生的主体的宽度和高度。
4.BOM里的宽高：window.screen.xxx
availHeight/availWidth:浏览器只显示网页内容的宽高（不随浏览器的窗口大小改变而改变）
height/width:浏览器的总体宽高（不随浏览器的窗口大小改变而改变）
-------------------------------------------------------------------------
一些差异
IE chrome opera们
1.window.screen.heigth:是你浏览器最大化的高度。
2.body html设为100%后的高度:分别是浏览器中间网页的高度 和页面高+滚动条高。
3.document没有高度，为null
火狐这个傻逼
1.window.screen.height：是从浏览器的选项卡那儿开始到网页区的高度
2.body html设为100%后的高度