JQuery 获得绝对,相对位置的坐标方法

想要获取某个元素在页面中的位置坐标，可以使用 jQuery 提供的 offset() 和 position() 方法。具体使用方法如下：

1. 获取相对于页面的绝对坐标：offset()

offset() 方法可以获取当前元素相对于文档顶部左上角的位置坐标，返回一个包含 top 和 left 属性的对象。

$(document).ready(function(){
    var $elem = $("#target");
    var offset = $elem.offset();
    console.log("Top: " + offset.top + " Left: " + offset.left);
});

上述代码首先定位到 id 为 target 的元素，然后使用 offset() 函数获取元素相对于文档左上角的偏移量，并将其存储为变量 offset。最后使用 console.log() 函数输出获取到的 top 和 left 属性。

2. 获取相对于父元素的相对坐标：position()

position() 方法可以获取当前元素相对于其父元素的位置坐标，同样也返回一个包含 top 和 left 属性的对象：

$(document).ready(function(){
    var $elem = $("#target");
    var position = $elem.position();
    console.log("Top: " + position.top + " Left: " + position.left);
});

上述代码首先定位到 id 为 target 的元素，然后使用 position() 函数获取元素相对于其父元素的位置，并将其存储为变量 position。最后使用 console.log() 函数输出获取到的 top 和 left 属性。

以上就是使用 jQuery 获取绝对坐标和相对坐标的两种方法示例，通过这些代码可以清楚地了解这两个方法的使用和区别。