共计 758 个字符，预计需要花费 2 分钟才能阅读完成。
js 中各种位置
js 中有各种与位置相关的属性, 每次看到的时候都各种懵逼。索性一次总结一下。clientHeight
内容可视区域的高度。包括 padding 不包括 border、水平滚动条、margin。对于 inline 的元素这个属性一直是 0，单位 px，只读元素。
offsetHeight
offsetHeight = clientHeight + border + 滚动条。对于 inline 的元素，这个属性一直是 0，单位 px，只读元素。
scrollHieght
当子元素的高度比本元素高, 且 overflow 不等于 hidden 时,scrollHeight 就是网页实际内容的高度。包括可视区域和被滚动条隐藏的区域。
clientWidth offsetWidth scrollWidth
同 height
clientTop
元素上边框的厚度, 当没有指定时, 一般为 0
offsetTop
元素距离父元素顶端的高度
scrollTop
滚动条被隐藏部分的高度, 一般用来计算向下滚动多少像素
clientLeft offsetLeft scrollLeft
同 top
event.clientX event.clientY
相对于窗口可视区域的 X,Y 坐标, 可视区域不包括工具栏和滚动条。
event.pageX event.pageY
类似于 event.pageX、event.pageY, 但他们使用的是文档坐标而非窗口坐标。这两个属性不是标准属性，但得到广泛支持。event.pageX = event.clientX + 横向滚动条距离。
event.offsetX event.offsetY
鼠标相对于事件源元素 (target) 的 X,Y 坐标，只有 IE 事件有这两个属性，标准事件没有对应的属性
screenX screenY
鼠标相对于用户显示器左上角的 X,Y 坐标。标准事件和 IE 事件都定义了这两个属性