在前端開發中，我們經常需要定位一個元素。如tooltip、popover或者modal等，或許是我們需要将它們定位在依賴元素的周圍或螢幕滾動螢幕中心位置。這對于前端開發的碼農來說并不是難事。算出和依賴元素的offset，設定元素的left、right。對于稍複雜的場景我們可能需要考慮被positioned的祖先元素。
但往往不是所有的事情都是這麼簡單的。筆者最新在項目開發中就遇見這樣一個問題：這裡的html是嵌入的，其來自jpedal商業軟體從pdf檔案自動生成的；為了展示的樣式，jpedal統一使用了 position:absolute和relative來定位pdf元素。然而由于業務的需求，我們需要操作這類html。其中一個需求就是需要在每段文字附近顯示操作工具條。
對于這類未知的dom定位，那麼我們就需要周遊它的dom樹來計算它的相對位置了。行為下面的這段代碼：
在這裡，我們會根據元素遞歸查詢它所在的的dom樹中被positioned的最接近的祖先元素，然後才計算它們的相對位置。
在$position服務中為我們提供了3個有用的位置服務：position、offset和positionelements。position是計算具體元素的定位位置，傳回一個帶有width、height、top、left的對象；positionelements則是傳回某元素相對于其依賴容器元素的定位位置，一個帶有top、left的對象。
筆者為了測試這寫api，在jsbin中寫了一個特定的指令：
javascript:
html:
是以我們可以如下測試這類api：
簡單的說：如果我們需要擷取某個元素的定位資訊，則我們可以用 $position.position(element)；擷取相對于固定元素的定位，則可以使用$position.positionelements(hostel, targetel, positionstr, appendtobody)。其中positionstr是一個橫向和縱向的字元串，如：”top-left”、”bottom-left”。其預設值為center。如筆者項目所期望的在某文字段落的左上角顯示工具條：
當然也不要忘記為toolbar元素設定position: absolute;