//在火狐和chrome和IE浏览器上的offsetLeft都是当前元素的marginLeft + offsetParent的paddingLeft,但是有一种情况下chrome的结果和[IE|FF]不一致,        //那就是在offsetParent为body的情况下, 在chrome下offsetParent为body的话offsetLeft会算上body.borderWidth                //通过zepto的el.position()获取的left和top值;                    //这个是指从父级的contentBox到子元素的margin-box(没有包含margin);                    $("#test-div2").position()        Object {top: 242, left: 20}        $("#test").position()        Object {top: 40, left: 40}        //因为是body,所以zepto计算的就有问题(好烂的解释方式),布局尽量清楚点,惹不起还怕躲不起吗么么哒;        $("body").position()        Object {top: -20, left: -20};                //难懂的东西自己去写就好懂了，要么看了看了越看越晕的;        知识点:通过zepto获取的 position() 返回的LEFT和TOP是相对父级元素的LEFT和TOP的值 .这个值是通过 getBoundingClientRect 的差值(父级的border + 父级的padding + 中间的各种宽度么么哒 + 子元素的margin) 减去 - 父级的border - 子元素的maring (符合一个元素的left或者是top是父级元素的content-box 到子元素的margin的距离);        知识点：getBoundingClientRect()获取的也是相对界面的值,jQ和zepto的position实现就是根据getBoundingClientRect(),getBoundingClientRect是从元素的border-box开始的(包含border-box)到界面左上角的距离;        知识点：chrome的开发者工作的实时查看margin,border,padding,content调试的颜色是从浅入深的;            {                margin : 橘色,                border : 灰色,                padding : 褐色,                content : 偏蓝色            }            火狐            {                margin : 黄色,                border : 偏黑色,                padding : 紫色,                content : 偏蓝色            }        
    
     
    
     
    

 

网页可见区域宽： W3C标准:document.documentElement.clientWidth ; IE低版本:document.body.clientWidth;        (        	PS： document.documentElement.clientWidth是指不包含滚动条的宽度,        	window.innerWidth是包含滚动条长度的用户宽度,            window.outerWidth是指window.innerWidth加上包含外部边框的长度;            如果一个元素出现了垂直滚动条,那么这个元素的clientHeight还是offsetHeight-border*2, 只有父级的clientHeight才是可视区的高度;            如果该元素隐藏了,就什么值都获取不到了;        )         网页可见区域高： W3C标准:document.documentElement.clientHeight ; IE低版本:document.body.clientHeight;         (PS： 因为现代浏览器的html为用户界面, body元素是一个正常的元素, 滚动时出现在html元素的,        	在IE低版本下面的html是隐藏的,body是出现滚动的元素);         网页可见区域宽： W3C标准:document.body.offsetWidth   (包括border和padding的宽);             知识点==>> W3C标准:offsetWidth === contentWidth(内容宽) + border-width*2 + padding-width*2;        网页可见区域高： 同上;        W3C标准下的width === 内容区域的宽;		IEquirk模式width === 包含paddingw和border的宽度;         用户高度:  clientHeight不包含margin和border的高度, 即为padding值加上content-height;         clientLeft: 其实这个就是border-left的长度, 跟margin居然没有关系,感觉没有存在的意义(WEBKIT测试结果)