javascript - 如何获取其父元素的子元素的左侧和顶部位置

Question

我有一个 div 元素的父子结构(父级是名为 dartboard 的 div，一个名为rotatingDiv 的子级 div，然后有一个名为 crosshair 的子级)。

dartboard
     > roatingDiv
            > crosshair

飞镖容器包含一个旋转容器 (rotaingDiv)，然后该容器包含一个子元素 (crosshair)。我想找到相对于飞镖板容器的 x 和 y 位置。这是我目前拥有的:

$('#dartboard').append( $('#rotatingDiv').append( $('#crosshair') ) );

        X = $('#crosshair').position().left.toFixed(1) 
        Y = $('#crosshair').position().top.toFixed(1) 

console.log("x is "+X+", y is "+Y);

这个过程在每秒计时器内运行，在检查 x 和 y 值时，我注意到我只收到与旋转 Div 内的十字准线元素有关的信息，而不是在飞镖板上的信息级别(父级的父级)。有谁知道我该怎么做？

Answer 1

试试这个:

var parentLeft = $('#parent').offset().left,
    parentTop = $('#parent').offset().top
    childLeft = $('#child').offset().left,
    childTop = $('#child').offset().top;


// Positions respective to parent
var top = parentTop - childTop,
    left = parentLeft - childLeft;

您还可以使用位置。