.offset（）并检查jQuery中的位置

Question

这是我的HTML代码：

<div class="snake">
        <div class="body"></div>
    </div>

在脚本中，我有一个函数可以创建身体部位并将其附加到.snake 。

看起来像这样：

$('.btn1').click(function() {
    length++;
    $('<div></div>').addClass('body').appendTo('.snake').css('left', xPos * length * 1.2 + '%');   
});

然后另一个函数删除最后一个正文部分，创建一个新的正文部分，将其放在顶部，并赋予它.head类。

$('.snake').children().last().remove();
$('<div></div>').addClass('body').prependTo('.snake').css('top', 0 + '%').css('left', xPos * blocks_moved * 1.2 + '%');
$('.snake').children().removeClass('head');
$('.snake').children().first().addClass('head');

因此，每次调用此函数时，都会为.head类指定新的<div> 。

var headPos = $('.head').offset();
            alert(headPos);

在上面的两行代码中，我尝试警告.head的位置，但我使用了.offset()因此它应根据文档（而不是父元素.offset()来警告坐标。 这两行也在上面的功能中。 它会发出类似[object Object]的警报。 为什么这不起作用？ 我需要此变量，因此我可以将.snake位置设置为与.head位置相同。

我用$('.snake').position(headPos); 但我认为.position()函数无法设置位置。 这样做的任何其他方式以及.offset()一些帮助都很好。 我是编程新手，所以任何建议都将对您有所帮助。 :)

聚苯乙烯

我忘了一件事。 那css呢？ 我应该使用哪个位置值？ 我使用的position: absolute; 头部和身体各部分。

Answer 1

offset()是包含两个属性top和left的对象。

使用offset().top获取y位置

var headPos_x = $('.head').offset().left;
var headPos_y = $('.head').offset().top;
alert("x:" + headPos_x + ", y:" + headPos_y);