我用到的clientHeight等属性

弹出浮动层，让起居于浏览器底部是需求中，我用到的各种height有：

1  浏览器可见区域高度：document.documentElement.clientHeight;

   ***document.body.clientHeight*** 是整个页面内容的高度，而非浏览器可见区域的高度

2 滚动条已滚动的高度：document.documentElement.scrollTop;

   ***chrome 中 document.body.scrollTop才是滚动条滚过的高度***

   那么要得到滚动条的高度：有一个技巧：

var sTop=document.body.scrollTop+document.documentElement.scrollTop;

这两个值总会有一个恒为0，所以不用担心会对真正的scrollTop造成影响。一点小技巧，但很实用。

3 offsetTop、offsetLef

offsetParent 不同于parentNode ,offsetParent 返回的是在结构层次中与这个元素最近的position为absolute\relative\static的元素或者body

<style>
body{margin:0;padding:0;}
.absoluteParent{position:absolute;background:red;padding:10px;margin:10px;border:1px solid blue;width:100%;height:80px;}
.sible{background:blue;width:100%;height:20px;}
.parent {background:yellow;width:100%;height:20px;}
#node{height:15px;width:100%;background:black;padding:5px;margin:7px;}
</style>

<div class="absoluteParent">
		<div class=sible></div>
    <div class=parent>
			<div id=node></div>
	</div>
</div>

从这个例子中，我们学习了两点
一 node 的offsetParent 是absoluteParent ,他的parentNode 是 parent；当absoluteParent的position去掉后，node的offsetParent 是body

二 通过offsetLeft属性，我们得到node节点距离offsetParent的左距离。其中左距离，有关键的两个节点需要注意。offsetParent节点从padding算起，node节点从margin开始算起，算这两个量之间的距离，即是左距离。（通过测试，调整absoluteParent 的margin 和 border 并不改变offsetLeft的值；调整node的border和padding属性，也不会改变offsetLeft的值）

offsetLeft 来计算某个元素距body的左距离，其中type可以为offsetLeft 和offsetTop

getPosition = function (obj, type) {
    //offsetLeft or offsetTop
    var distance = 0;
    while (obj && !__.lang.isEmpty(obj.offsetParent)) {
      distance += obj[type];
      obj = obj.offsetParent;
    }
    distance += parseInt(__.doc.body[type], 10);
    return distance;
  };

4 height \ offsetHeight \clientHeight获取元素的高度

height: 为css中定义的height属性的高度，如果为定义，则为undefined

offsetHeight: 元素的内容高度+padding+border

clientHeight:元素的可见区域高度，可以理解为内容高度（如果有overflow：scroll属性，clientHeight的值再减去scrollbar的高度值，因为内容可见区域因为有scrollbar而变小了）