js位置尺寸

元素

.offsetParent 获取父级元素

元素尺寸

偏移尺寸

    .offsetHeight;  高度(加上边框和可见的水平滚动条),只读
    .offsetWidth;   宽带(同上),只读

客户端尺寸

    .clientHeight;  高度(不含边框滚动条),只读
    .clientWidth;   宽度(同上),只读

另一种方法

    .getBoundingClientRect().height;
    .getBoundingClientRect().width;  

滚动尺寸

.scrollHeight; //没有滚动条时的高度
.scrollWidth; //没有滚动条时的宽度

修改尺寸

.style.height="20px";  //设置元素高度
.style.width="20px";  //设置元素宽度

元素位置

偏移位置

.offsetTop 上边框外部到父级上边框内侧的距离
.offsetLeft 左边框外部到父级左边框内侧的距离

另一种方法

.getBoundingClientRect().top;  顶部到上面
.getBoundingClientRect().bottom;  底部到上面
.getBoundingClientRect().left;  元素左边到左边
.getBoundingClientRect().right;  元素右边到左边

滚动位置

获取滚动隐藏位置

.scrollLeft; //左侧隐藏的像素数
.scrollTop; //顶部隐藏的像素数

滚动到指定位置

 .scrollTop=0;   //滚动到顶部
 .scrollLeft=0;   //滚动到最左边

修改位置

.style.left="20px";
.style.top="20px";

鼠标位置

屏幕坐标

.screeY; //距离屏幕顶部距离
.screeX; //距离屏幕左侧距离

客户端坐标

.clientY; //距视口顶部距离    
.clientX; //距视口左侧距离    

页面坐标(未发生滚动时,和客户端坐标一致)

.pageY; //到页面顶部的位置,
.pageX; //到页面左侧的位置,