在实战项目中，我们经常会想获取客户端的可视高度，客户端的大小的，页面的高度，但是却一下脑子却想不起来。因为我回想到很多名词，比如screenLeft，clientX，pageX，这些名词，但感觉他们都差不多。我想必要系统把他们给揪出来好好区分一下。

获取客户端高度，和宽度

夸浏览器确定一个客户端的高度，和宽度可不是，一件容易的事情。
IE9,Firefox,Safari,Opera和chrome均为此提供了四个属性，innerHeight,innerWidth,outerHeight,outerWidth。出了Opear，chrome以外，其他outerHeight都是浏览器大小，而Opera返回的浏览器减去边边框的宽度，chrome返回的视口宽度。

在浏览器中保留了documen.doucmentElment.clientWidth保留视口的信息，但是在ie下只能是标准模式下，才能怎么获取，不然必须要用document.body.clientWidth来获取视口信息

var pageWidth = window.innerWidth; var pageHeight = window.innerHeight; if (typeof pageWidth != "number") { if (document.compatMode == "CSS1Compat") { pageWidth = document.documentElment.clientWidth; pageHeight = document.documentElment.clientHeight; } else { pageWidth = document.body.clientWidth; pageHeight = document.body.clientHeight; } }

移动端window.innerWidth和window.innerHeight是保存视口的，但是ie浏览器却不是，但通过document.documentElement.clientHeight来标记视口。页面大小没什么可说的documen.body.ClientHeight用获取客户端高度。

获取鼠标的高度

鼠标触发事件后，在回调函数中，会传入event参数，这个参数会提供一些信息。
event.clientX：事件对象离视口的水平距离
event.pageX：事件的对象页面高度。
documen.body.scollTop: 滚动的高度

scollTop + clientY 与pageY相等