資訊專欄INFORMATION COLUMN
摘要：這個版本新增這個選擇元素的方法還是比較常用的首先我們需要一個來過濾我們需要的上面那段比較簡單就是普通的過濾下元素看下方法的源碼就知道我傳入數(shù)組對象的個對象然后取它的下一個同輩元素直接返回方法同理這段是取到第一個父元素由于返回的不是原生的對
Lesson-2
這個版本新增 next(),prev(),parent(),parents()
這4個選擇元素的方法還是比較常用的
首先我們需要一個func來過濾我們需要的dom
function sibling(cur, dir) {
while ((cur = cur[dir]) && cur.nodeType !== 1) {}
return cur;
}
上面那段比較簡單,就是普通的過濾下元素
next : function() {
return sibling(this[0], "nextSibling");
},
prev : function() {
return sibling(this[0], "previousSibling");
},
看下next方法的源碼就知道,我傳入Kodo數(shù)組對象的0個dom對象,然后取它的下一個同輩元素,直接返回,prev方法同理
parent : function() {
var parent = this[0].parentNode;
parent && parent.nodeType !== 11 ? parent : null;
var a = Kodo();
a[0] = parent;
a.selector = parent.tagName.toLocaleLowerCase();
a.length = 1;
return a;
},
這段是取到第一個父元素,由于parent()返回的不是原生的DOM對象,是封裝過的數(shù)組對象(Kodo),那我們就想辦法構(gòu)造一個新的Kodo對象即可
所以我在里面var了一個 Kodo,然后設(shè)置這個Kodo數(shù)組對象的selector等配置,然后直接返回這個新的Kodo對象
parents : function() {
var a = Kodo(),
i = 0;
while ( (this[0] = this[0][ "parentNode" ]) && this[0].nodeType !== 9 ) {
if ( this[0].nodeType === 1 ) {
a[i] = this[0];
i++;
}
}
a.length = i;
return a;
}
同理,在jQuery的parents方法中,返回的依舊是jQuery對象.我們依舊用上面的辦法,構(gòu)造一個新對象并且返回就好了!
中間一層while循環(huán),依次過濾出我們需要的dom元素,然后把他們都賦值到我們新var的對象里,最后別忘了設(shè)置一下新對象的length屬性,返回我們的新對象即可!
看了上面幾個方法是不是覺得!其實很多時候我們完全可以自己新創(chuàng)建一個對象,然后配置好它直接返回這個新對象.比如find方法我們也可以用這樣的辦法:)
github地址: https://github.com/MeCKodo/forchange/tree/master/lesson-2
可想造一個屬于你自己的jQuery庫?(一)：http://segmentfault.com/a/1190000003997282
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/86212.html
摘要：修改里的判斷新增我們知道在中還有一種選擇器寫法在加載完畢后馬上就執(zhí)行這樣的方法會比更快所以對于我們來說一定是必不可少的我們在方法中要新增以下判斷首先可能為的情況比如傳入的是原生對象數(shù)組對象另外要記得轉(zhuǎn)為數(shù)組因為有可能是一個元素比如是等否則 Lesson-3 修改f(selector) 里的判斷,新增domReady 我們知道在jQuery中還有一種選擇器寫法 $(function()...
摘要：事件機制在講事件機制之前呢我們有一個很重要的東西要先講那就是如何實現(xiàn)事件委托代理只有必須先明白了如何實現(xiàn)一個事件委托我們才能更好的去實現(xiàn)和在我看來和里最難實現(xiàn)的就是他的事件委托以上是我對整個委托的實現(xiàn)當然在這只做了非常簡單的實現(xiàn)沒有對很多 Lesson-8 事件機制 在講事件機制之前呢,我們有一個很重要的東西要先講,那就是如何實現(xiàn)事件委托(代理). 只有必須先明白了如何實現(xiàn)一個事件委...
摘要：事件機制在講事件機制之前呢我們有一個很重要的東西要先講那就是如何實現(xiàn)事件委托代理只有必須先明白了如何實現(xiàn)一個事件委托我們才能更好的去實現(xiàn)和在我看來和里最難實現(xiàn)的就是他的事件委托以上是我對整個委托的實現(xiàn)當然在這只做了非常簡單的實現(xiàn)沒有對很多 Lesson-8 事件機制 在講事件機制之前呢,我們有一個很重要的東西要先講,那就是如何實現(xiàn)事件委托(代理). 只有必須先明白了如何實現(xiàn)一個事件委...
閱讀 3205·2021-11-08 13:21
閱讀 1196·2021-08-12 13:28
閱讀 1406·2019-08-30 14:23
閱讀 1924·2019-08-30 11:09
閱讀 840·2019-08-29 13:22
閱讀 2685·2019-08-29 13:12
閱讀 2549·2019-08-26 17:04
閱讀 2250·2019-08-26 13:22
