web-dev-qa-db-ja.com

jQuery：position（）とoffset（）の違い

position()とoffset()の違いは何ですか？クリックイベントで次のことをしようとしました。

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

そして、それらはまったく同じように見える...（クリックされた要素はテーブルのテーブルセル内にあります）

jquerypositioning
172
Svish

これは、要素がどのコンテキストにあるかによって異なります。positionは、位置オフセットの親を基準を返し、offsetは同じ文書を基準を返します。明らかに、ドキュメントがオフセットの親である場合（これがよくあるケースです）、これらは同一になります。

ただし、このようなレイアウトがある場合：

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

この場合、subのoffsetは200：200になりますが、そのpositionは0：0になります。

205
David Hedlund

。offset（）メソッドにより、ドキュメントに関連する要素の現在位置を取得できます。これを。position（）と比較してください。これは、オフセットの親に対して相対的な現在位置を取得します。グローバル操作（特にドラッグアンドドロップの実装）のために既存の要素の上に新しい要素を配置する場合、.offset（）の方が便利です。

ソース： http://api.jquery.com/offset/

28
jAndy