position()函数用于返回当前匹配元素相对于其被定位的祖辈元素的偏移，也就是相对于被定位的祖辈元素的坐标。该函数只对可见元素有效。

所谓"被定位的元素"，就是元素的CSS position属性值为absolute、relative或fixed(只要不是默认的static即可)。

该函数返回一个坐标对象，该对象有一个left属性和top属性。属性值均为数字，它们都以像素(px)为单位。

与offset()不同的是：position()返回的是相对于被定位的祖辈元素的坐标，offset()返回的是相对于当前文档的坐标。此外，position()函数无法用于设置操作。如果当前元素的祖辈元素全部都是默认定位(static)，那么该函数返回的偏移位置与offset()函数相同。

该函数属于jQuery对象(实例)。

语法

jQuery 1.2 新增该函数。

jQueryObject.position( )返回值

position()函数的返回值为Object类型，返回一个相对于离它最近的"被定位的"祖辈元素的偏移坐标对象，该对象具有left和top属性。

如果当前jQuery对象匹配多个元素，返回坐标时，position()函数只以其中第一个匹配的元素为准。如果没有匹配的元素，则返回undefined。

position()中的坐标参考系是以被定位的祖辈元素的左上角为原点(0,0)，向右为正，向下为正。

示例&说明

以下面这段HTML代码为例：

<br> <br> <p id="n1"><span id="n2">专注于编程开发技术分享</span></p>

以下jQuery示例代码用于演示position()函数和offset()函数的用法：

var $n2 = $("#n2"); // 输出n2的偏移坐标 var pos = $n2.position(); document.writeln( "n2的position()偏移坐标：(" + pos.left + ", " + pos.top + ")" ); // n2的position()偏移坐标：(8, 60) var coord = $n2.offset(); document.writeln( "n2的offset()的偏移坐标：(" + coord.left + ", " + coord.top + ")" ); // n2的offset()的偏移坐标：(8, 60)

运行代码

从上述jQuery的运行结果可知，position()并不是获取相对于其父元素的偏移位置。如果n2的祖辈元素全部为默认定位，则position()返回的偏移位置和offset()函数一致。

下面，我们将上述HTML代码中的n1加上相对定位(relative)：

<br> <br> <p id="n1" style="position: relative;" ><span id="n2">专注于编程开发技术分享</span></p>

运行代码

然后，我们重新执行上述jQuery代码，可以看到以下结果：

var $n2 = $("#n2"); // 输出n2的偏移坐标 var pos = $n2.position(); document.writeln( "n2的position()偏移坐标：(" + pos.left + ", " + pos.top + ")" ); // n2的position()偏移坐标：(0, 0) var coord = $n2.offset(); document.writeln( "n2的offset()的偏移坐标：(" + coord.left + ", " + coord.top + ")" ); // n2的offset()的偏移坐标：(8, 60)

此时，在n2的祖辈元素中，n1是离n2最近的定位的祖辈元素(这里是relative，absolute、fixed也是如此)，因此position()返回n2相对于n1的偏移位置。

26 8

我们认为： 用户的主要目的，是为了获取有用的信息，而不是来点击广告的。因此本站将竭力做好内容，并将广告和内容进行分离，确保所有广告不会影响到用户的正常阅读体验。用户仅凭个人意愿和兴趣爱好点击广告。
我们坚信：只有给用户带来价值，用户才会给我们以回报。
CodePlayer技术交流群1：

帮朋友打一个硬广告：

P2P网贷系统(Java版本) 新年低价大促销，多年P2P技术积累，系统功能完善（可按需定制，可支持第三方存管、银行存管），架构稳定灵活、性能优异、二次开发快速简单。 另可提供二次开发、安装部署、售后维护、安全培训等一条龙服务。

外行看热闹，内行看门道。可以自信地认为，在系统设计上，比市面上的晓风、迪蒙、方维、绿麻雀、国融信、金和盛等P2P系统要好。
深圳地区支持自带技术人员现场考察源代码、了解主要技术架构，货比三家，再决定是否购买。

也可推荐他人购买，一旦完全成交，推荐人可获得实际售价 10% 的返现。
有意向者，详情请 点击这里 联系，工作时间立即回复。