js宽高
window.innerHeight 表示文档高度 可见区域高度 不是文档的总高 //ie9以上兼容
window.outerHeight 表示浏览器窗口高度包括菜单栏
window.screen.height 表示屏幕分辨率的高度
window.screen.width 表示屏幕分辨率的宽度
window.screen.availHeight 表示window操作系统下出去任务栏的高度
window.screen.screenTop 表示浏览器窗口上边距屏幕顶端的距离
window.screen.screenLeft 表示浏览器距离屏幕左边的距离
document.clientWidth 表示文档可视区域宽度
document.clientHeight 表示文档可见区域的高度
元素dom对象的clientWidth 和clientHeight的宽高原理如下：
假如无滚动条 无padding clientWidth=style.width
假如有padding无滚动条
clientWidth=style.width+style.pading*2
假如有滚动条 有padding
clientWidth = style.width+style.padding*2-滚动条宽度 （mac系统滚动条宽度为0 win7滚动条有宽度）
document.clientLeft就是body的border-left值线条宽度
document.clientTop就是body的boder-top的值线条宽度
dom对象的.clientLeft clientTop也是border的宽度
offsetHeight ， offsetWidth 等于 padding+border+content，该属性和元素内部内容是否超出元素内部是没有关系的，只和本来设定的border width padding有关
假如offsetWidth无滚动条无padding 无border
offsetWidth = clientWidth = style.width
假如有padding 有border 无滚动条
offsetWidth = clientWidth+border-width*2
offsetWidth = style.width+padding*2+border-width*2
假如有padding 有border 有滚动条
offsetWidth = style.width+style.padding*2+style.border*2+滚动条宽度
offsetWidth = clientWidth + border-width*2+滚动条宽度
offsetTop offsetLeft 依赖于offsetParent
1 如果当前元素的父元素没有css定位（relative basolute） offsetParent为body
2 如果当前元素的父元素有css定位，offsetParent取最近的那个父元素
但是offsetLeft offsetTop 存在浏览器兼容问题
doucment.bosy.scrollWidth 与document.body.scrollHeight，如果给定的body 的width height 小于浏览器窗口的宽高，那么doucment.bosy.scrollWidth 与document.body.scrollHeight就是浏览器的宽高，
给定宽高大于浏览器窗口，且内容小于给定宽高，
scrollWidth = 给定的宽度+所有padding+ 所有margin+所有padding
div的scrollWidth 在有滚动条的情况下的值是实际内容的宽度，超出了offsetWidth的宽度
无滚动轴时
scrollWidth = clientWidth = style.width + style.padding*2
有滚动轴时
scrollWidth = 实际内容的宽度+style.padding*2
scrollTop scrollLeft 指的是内容被卷起的高度和宽度，内容超过div 或可是区域时
当内容高度大于div的height 就出现滚动条，当设置div为overflow为hidden时，只显示height高度内容 其余多出部分隐藏
事件对象event相关坐标介绍
event.clientX和clientY表示当前鼠标点距离浏览器（可视区域）的坐标位置（距离可视区域的距离）
screenX，screenY表示当前鼠标点相对于设备左上角的坐标位置（距离左上角的距离）
offsetX，offsetY表示事件源的位置，比如div内点击事件，表示当前点击点距离点击div的距离
pageX，pageY表示相对于整个网页左上角的坐标（距离）有滚动轴，滚上去相对于网页左上角的距离就用该属性
X,Y返回的结果和clientX,clientY的结果是一样的但是该属性存在浏览器兼容问题
window.screenX和window.screenY的值和window.screenLeft window.screenTop的值是一样的都是表示浏览器窗口到设备的距离
getBoundingClientRect()可以直接获取该div到浏览器可视区域顶部的距离，不存在浏览器兼容问题，所以不用offsetLeft offsetTop 这两个值 因为存在兼容问题
jquery相关宽高
width（）表示元素的windth宽度，不是内容的宽度
innerwidth（）width+padding*2
ourterwidth（）width+padding*2+border*2
ourterwidth（true）width+padding*2+border*2+margin*2
window document是不能通过jquery设置宽高的，也就是说不能通过width（）innerwidth（）ourterwidth（）设置window document的宽高 这是无效的 只能获取
对于普通dom元素是可以获取 设置 的width（）innerwidth（）ourterwidth（）
css（“width”）返回的长度带px单位
width（）返回的长度不带px单位 这是和css的区别
scrollTop（）返回卷起的高度
scrollLeft（）返回左侧卷起的高度
offset（）返回相对于document的当前坐标值
相对于body左上角的left top的值
postion（）的值如果父元素设置了position：relative fixed absolute 那么就是距离父元素的距离
如果没有设置那么和offset（）的值相等，就是距离body的top left的值
($window).height()返回窗口高度
($document).height()返回整改文档的高度