JS offsetParent属性：获取最近的上级定位元素

在 JavaScript 中，offsetParent 属性表示最近的上级定位元素。要获取相对父级元素的位置，可以先判断 offsetParent 属性是否指向父元素，如果是，则直接使用 offsetLeft 和 offsetTop 属性获取元素相对于父元素的距离；否则分别获得当前元素和父元素距离窗口的坐标，然后求差即可。

//获取指定元素距离父元素左上角的偏移坐标

//参数：e表示获取位置的元素

//返回值：返回对象直接量，其中属性x表示x轴偏移距离，属性y表示y轴偏移距离

function getP (e) {

 if (e.parentNode == e.offsetParent) { //判断offsetParent属性是否指向父级元素

 var x = e.offsetLeft; //如果是，则直接读取offsetLeft属性值

 var y = e.offsetTop; //读取offsetTop属性值

 } else { //否则调用getW()扩展函数获取父元素的偏移位置，并返回它们的差值

 var o = getPoint (e);

 var p = getPoint (e.parentNode);

 var x = o.x - p.x;

 var y = o.y - p.y;

 return { //返回当前元素距离父元素的坐标

 x : x,

 y : y

}

下面调用该扩展函数获取指定元素相对父元素的偏移坐标。

var box = document.getElementById( box 

var o = getP (box); //调用扩展函数获取元素对应父元素的偏移坐标

console.log(o.x); //读取x轴坐标偏移值

console.log(o.y); //读取y轴偏坐标移值

23309.html

javaJavaScript