jQuery:position()和offset()之间的区别

Question

position()和之间有什么区别offset()？我尝试在点击事件中执行以下操作:

console.info($(this).position(), $(this).offset());

它们似乎返回完全相同的...(点击的元素在表格的表格单元格内)

Answer 1

这取决于元素所处的上下文.position返回相对于偏移父项的位置,并相对于文档{left: x, top: y}执行相同的操作.显然,如果文档是偏移父代(通常是这种情况),则它们将是相同的.

但是,如果你有这样的布局:

 <div style="position: absolute; top: 200; left: 200;">
     <div id="sub"></div>
 </div>

然后offsetfor 子 将是200:200,但{left: x, top: y}它将是0:0.

Answer 2

所述.offset()方法允许我们以检索一个元素的当前位置相对于文档.将此与.position()进行对比,该位置检索相对于偏移父项的当前位置.将新元素定位在现有元素之上以进行全局操作(特别是实现拖放)时,.offset()更有用.

资料来源:http://api.jquery.com/offset/