Javascript 如何获取父div内元素的像素距离

因此，我使用Jquery和纯js来编写小型应用程序，我在div父级中有一个元素。这个可拖动元素（ui小部件）可以在div父级中移动。我希望从顶部和左侧获得确切的像素数

这就是我的意思：

我现在有下面的代码，但是用这段代码我无法从顶部和底部得到精确的像素数

$('#dragThis').draggable(
{
    drag: function(){
        var parentOffset =$(this).parent().offset(); 
        var offset = $(this).offset();
        var xPos = offset.left - parentOffset.left ;
        var yPos = offset.top - parentOffset.top  ;
        $('#posX').text('x: ' + xPos);
        $('#posY').text('y: ' + yPos);
    },
    containment: "#parentDiv"
});

工作示例：

请帮忙。

试试这个方法。它允许您检索元素相对于偏移父元素的当前位置。您也可以尝试

$（this.css（'left'）

或

$（this.css（'top'）

---

更新的小提琴

是的，但这样我就得不到px的数量，对吗？我对纯js也做了同样的操作，但像素数量不匹配