首先是 parentElement 屬性，這個屬性好理解，就是在 DOM 層次結構定義的上下級關系，如果元素A包含元素B，那麼元素B就可以通過 parentElement 屬性來獲取元素A。
這裡主要說的是 offsetParent 屬性，這個屬性在 MSDN 的文檔中也沒有解釋清楚，這就讓人更難理解這個屬性。 這幾天在網上找了些資料看看，再加上自己的一些測試，對此屬性有了那麼一點的了解，在這裡總結一下。
要明白 offsetParent 屬性，要先明白“已定位元素” 這個名字，所謂“已定位元素”就是指給元素設置了 position 屬性的樣式，並且 position 樣式屬性的值等於 absolute、relative、fixed 之一的元素。
在使用 offsetParent 屬性獲取父級對象時有以下兩種情況：
1、元素本身已經定位
如果元素本身已經定位，那麼 offsetParent 屬性返回此元素已定位父級元素，如沒有已定位的父級元素，則返回 BODY 對象，例如：
復制代碼 代碼如下:
<body>
<p>
<div>
<span id="obj1" style="position:absolute"></span>
</div>
<div id="pObj1" style="position:absolute">
<span id="obj2" style="position:absolute"></span>
</div>
</p>
</body>
obj1.offsetParent 返回 BODY 對象
obj2.offsetParent 返回 pObj1 對象
2、元素沒有定位
如果元素沒有定位， offsetParent 不但會找已經定位的父級元素而且還會查找類型為 TD 和 TABLE 的父級元素，只要找到這三種父級元素的其中任何一種元素將返回此元素，否則返回 BODY 對象，例如：
復制代碼 代碼如下:
<table width="500" border="0">
<tr>
<td id="td1">
<div id="pObj1">
<span id="obj1"></span>
</div>
</td>
</tr>
<tr>
<td>
<div id="pObj2" style="position:relative">
<span id="obj2"></span>
</div>
</td>
</tr>
</table>
obj1.offsetParent 返回 td1 對象
obj2.offsetParent 返回 pObj2 對象
在 DOM 元素的屬性裡，還有 parentNode 這個屬性，其實這個屬性跟 parentElement 屬性是一個意思，parentElement 屬性是 IE 特有的，W3C 標准是使用 parentNode 屬性，還有 children 和 childNodes, children 是 IE 特有的， childNodes 被其他浏覽支持。