位置:首页 > 软件操作教程 > 编程开发 > JavaScript > 问题详情

JavaScript 使用offsetParent

提问人:刘团圆发布时间:2020-11-27

■知识点

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

■实例设计

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

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

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

functiongetP(e){

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

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

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

    }

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

        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.getElementByld("box"); 

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

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

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

继续查找其他问题的答案?

相关视频回答
回复(0)
返回顶部