2025年4月26日 星期六 乙巳(蛇)年 正月廿七 夜 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 编程开发 > JavaScript

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

时间:03-07来源:作者:点击数:43

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轴偏坐标移值
方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门