js實(shí)現(xiàn)jquery的offset()方法實(shí)例
本文實(shí)例講述了js實(shí)現(xiàn)jquery的offset()方法。分享給大家供大家參考。具體分析如下：
用過jQuery的offset()的同學(xué)都知道offset().top或offset().left很方便地取得元素相對(duì)于整個(gè)頁面的偏移。
而在js里，沒有這樣直接的方法，節(jié)點(diǎn)的屬性offsetTop可以獲得該節(jié)點(diǎn)相對(duì)于父節(jié)點(diǎn)的相對(duì)偏移，但不能直接獲得其絕對(duì)偏移，我們可用節(jié)點(diǎn)逐層遞歸向上來相加offsetTop來獲得絕對(duì)偏移。
if (!offset) {
offset = {};
offset.top = 0;
offset.left = 0;
}
if (Node == document.body) {//當(dāng)該節(jié)點(diǎn)為body節(jié)點(diǎn)時(shí)，結(jié)束遞歸
return offset;
}
offset.top += Node.offsetTop;
offset.left += Node.offsetLeft;
return getOffset(Node.parentNode, offset);//向上累加offset里的值
}
使用時(shí)，則如：
//getOffset(a).top
//getOffset(a).left
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
javascript兩種function的定義介紹及區(qū)別說明
javascript兩種function的定義方式function a(){}和a=function(){}具體使用如下，感興趣的朋友可以參考下，希望對(duì)你對(duì)你學(xué)習(xí)function的定義有所幫助2013-05-05
javascript實(shí)現(xiàn)獲取指定精度的上傳文件的大小簡(jiǎn)單實(shí)例
下面小編就為大家?guī)硪黄猨avascript實(shí)現(xiàn)獲取指定精度的上傳文件的大小簡(jiǎn)單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10
本文主要介紹了JavaScript?對(duì)象的四種方式比較詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-05-05
JS操作對(duì)象數(shù)組實(shí)現(xiàn)增刪改查實(shí)例代碼
JS提供了很多方便操作數(shù)組的方法,這篇文章主要給大家介紹了關(guān)于JS操作對(duì)象數(shù)組實(shí)現(xiàn)增刪改查的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2021-07-07
本篇文章主要介紹了博客內(nèi)容進(jìn)度插件的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02
javascript使用eval或者new Function進(jìn)行語法檢查
使用代碼來實(shí)現(xiàn)分析代碼的語法，這是一件極其痛苦的事情。簡(jiǎn)單的解決辦法是：使用腳本引擎自己的語法檢查，比方說eval( ) 或者new Function( )。2010-10-10
JS網(wǎng)頁播放聲音實(shí)現(xiàn)代碼兼容各種瀏覽器
JS網(wǎng)頁播放聲音有多種方法可以實(shí)現(xiàn)，不過兼容各種瀏覽器的就沒有幾個(gè)了，不過本文的這個(gè)示例或許對(duì)大家有所幫助2013-09-09
JavaScript類型系統(tǒng)之正則表達(dá)式
正則又叫規(guī)則或模式，是一個(gè)強(qiáng)大的字符串匹配工具。javascript通過RegExp類型來支持正則表達(dá)式，本文給大家介紹javascript類型系統(tǒng)之正則表達(dá)式，對(duì)js正則表達(dá)式相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-01-01
javascript顯式類型轉(zhuǎn)換實(shí)例分析
這篇文章主要介紹了javascript顯式類型轉(zhuǎn)換,實(shí)例分析了javascript實(shí)現(xiàn)類型轉(zhuǎn)換的常用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
js中的this關(guān)鍵字平時(shí)在開發(fā)中使用時(shí)倒是也能正常應(yīng)用,但是對(duì)其使用和判斷并不能信手拈來,所以下面這篇文章主要給大家介紹了關(guān)于js中this關(guān)鍵字的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-07-07