jsz中scrollTop,clientTop,offsetTop

先来一张名气很大的图

看着实在是好晕，于是各种整理后手动画了一个：

发现主要分为几部分：

当定位时，position的移动的距离，

scrollHeight:文档总高度，可滚动总高度（包含元素本身，内外边距，边框）

scrollWidth:文档总宽度，可滚动总宽度（包含元素本身，内外边距，边框）

scrollTop:相对于滚动条顶部的偏移，指滚动条顶端与当前滚动条位置的距离

scrollLeft:相当于滚动与左端的偏移

clientHeight:可视区域高度（不包含边框，滚动条）

clientWidth:可视区域宽度

clientTop:内容区域相对于整个元素的左上角，当有边距时为边距的厚度，无边距时可以为0

clientLeft:内容区域相对于整个区域的左上角，有边距时为边距的宽度，可以为0

offsetHeight:获取自身元素（包含边距，滚动条）

offsetWidth:获取自身元素（包含边距，滚动条）

offsetTop:相对于最近定位祖元素的偏移，（祖元素必须是position,relative,absloute,fixed）

offsetLeft:同offsetTop

返回第一个祖定位元素，若父级元素无定位返回body,若父级元素已经定位返回相对应父级对应元素。

如果元素是body内的一级元素，可以用offsetLeft直接获得其左边距。

如果元素是嵌套的，且父元素中存在容器元素（即具有定位属性的元素，包括绝对定位、相对定位、固定定位），则情况要变复杂了，需要把所有容器的offsetLeft和元素的offsetLeft相加才是最终的左边距：

var obj=documentgetElementById("test"); //假定元素的id为test

var left=objoffsetLeft;

while(obj=objoffsetParent){

   left+=objoffsetLeft;

}

consolelog(left);  //left就是左边距

把var type=$("#tool_name"+i)innerHTML;换成：

var type = $(this)next("a")html();

就可以了。

因为click(function (){是个匿名函数，在里面不要写外面for循环的i，因为i会一直是同一个值，改一下，不使用i就可以了。

以上就是关于jsz中scrollTop,clientTop,offsetTop全部的内容，包括:jsz中scrollTop,clientTop,offsetTop、js 可以用offsetWidth 获取控件宽度 , 能获取左边框与body的距离吗、请教一个js的问题 获取元素的问题等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！