jQuery中position()與offset()區別

position()獲取相對於它最近的具備相對位置(position:relative或position:absolute)的父級元素的距離，若是找不到這樣的元素，則返回相對於瀏覽器的距離。

offset()始終返回相對於瀏覽器文檔的距離，它會忽略外層元素。

下邊看個簡單的例子，這裏外層的div元素(position:relative)僅一個：

<div id="outer" style="width:200px;position:relative;left:100px;">
    
 <div id="inner" style="position:absolute;left:50px;top:60px;">           
    </div>

 </div>

//獲取相對於最近的父級(position:relative或position:absolute)的位置


var vposition = $("#inner").position();


alert(vposition.left);   //輸出：50


alert(vposition.top);    //輸出：60

 var voffset = $("#inner").offset();


alert(voffset.left);   //輸出：$("#outer").offset().left+50

 alert(voffset.top);    //輸出：$("#outer").offset().top+60

在不一樣瀏覽器中,offset()獲得的相對於瀏覽器的位置不一樣，相信你看了上邊相應的註釋，已經掌握了position()同offset()方法的區別。