Javascript拖拽系列文章1之offsetParent屬性第2/3頁
更新時間：2008年09月22日 15:11:51 作者：
這個系列文章主要是講述實現(xiàn)Javascript拖拽功能的基礎知識，并將在最后給出一個完整的示例。適合對拖拽完全不懂的人閱讀
測試結果：
Firefox3："BODY"
Internet Explorer 7："BODY"
Opera 9.51："BODY"
Chrome 0.2："BODY"
Safari 3："BODY"
結論：
當某個元素及其父元素都未進行CSS定位時，則這個元素的offsetParent屬性的取值為根元素。更確切地說，這個元素的各種偏移量計算（offsetTop、offsetLeft等）的參照物為Body元素。（其實無論時標準兼容模式還是怪異模式，根元素都為Body元素）
測試代碼2：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
測試結果：
Firefox3："DIV"
Internet Explorer 7："DIV"
Opera 9.51："DIV"
Chrome 0.2："DIV"
Safari 3："DIV"
結論：
當某個元素的父元素進行了CSS定位時（absolute或者relative），則這個元素的offsetParent屬性的取值為其父元素。更確切地說，這個元素的各種偏移量計算（offsetTop、offsetLeft等）的參照物為其父元素。
測試代碼3：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
Firefox3："H1"
Internet Explorer 7："H1"
Opera 9.51："H1"
Chrome 0.2："H1"
Safari 3："H1"
結論：
當某個元素及其父元素都未進行CSS定位時（absolute或者relative），則這個元素的offsetParent屬性的取值為在DOM結構層次中距離其最近，并且已進行了CSS定位的元素。
相關文章
深拷貝和淺拷貝是面試中經(jīng)常出現(xiàn)的,主要考察對基本類型和引用類型的理解深度,本文主要給大家介紹了js實現(xiàn)深拷貝和淺拷貝的方式,需要的朋友可以參考下2022-05-05
深入理解JavaScript中為什么string可以擁有方法
下面小編就為大家?guī)硪黄钊肜斫釰avaScript中為什么string可以擁有方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
這篇文章主要為大家詳細介紹了純JS實現(xiàn)五子棋游戲，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-05-05
本文主要介紹了Javascript仿京東放大鏡效果的實例。具有很好的參考價值，下面跟著小編一起來看下吧2017-03-03
用js控件div的滾動條,讓它在內(nèi)容更新時自動滾到底部的實現(xiàn)方法
下面小編就為大家?guī)硪黄胘s控件div的滾動條,讓它在內(nèi)容更新時自動滾到底部的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
本篇文章主要介紹了詳解webpack介紹&安裝&常用命令，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
這篇文章主要為大家詳細介紹了layui添加動態(tài)菜單與選項卡，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-07-07
指定區(qū)域的圖片自動按比例縮小的js代碼（防止頁面被圖片撐破）
有時候我們更新的內(nèi)容，有很多的大圖片，就會導致頁面變形或看不到全圖。一般情況我們用css的max-width控制，但有些瀏覽器不支持，我們也可以用js做個補充2014-02-02
這篇文章主要介紹了js實現(xiàn)簡易拖拽的示例，幫助大家更好的理解和學習JavaScript,感興趣的朋友可以了解下2020-10-10
JavaScript中使用document.write向頁面輸出內(nèi)容實例
這篇文章主要介紹了JavaScript中使用document.write向頁面輸出內(nèi)容實例,本文講解了輸出普通文字、帶HTML標簽內(nèi)容的方法,需要的朋友可以參考下2014-10-10