可想造一個屬于你自己的jQuery庫?(二)

muzhuyu 發布于2019-08-28 18:21 / 2971人閱讀

摘要：初步體驗這個版本呢先來加四個很簡單的方法感受感受下首先個不用說了然后新增一個鏈式測試這些其實都很簡單我們都要記住我們封裝的對象是一個數組所以一定都需要用循環來進行各種個樣的處理然后這我是用的個數來進行判斷是取值還是設值最后千萬別忘了每個方

Lesson-1 初步體驗

這個版本呢,先來加四個很簡單的方法感受感受下!

首先3個class不用說了

hasClass : function(cls) {
    var reg = new RegExp("(s|^)" + cls + "(s|$)");
    for (var i = 0; i < this.length; i++) {
        if (this[i].className.match(reg)) return true;
            return false;
    }
    return this;
},
addClass : function(cls) {
    var reg = new RegExp("(s|^)" + cls + "(s|$)");
    for (var i = 0; i < this.length; i++) {
        if(!this[i].className.match(reg))
            this[i].className += " " + cls;
    }
    return this;
},
removeClass : function(cls) {
    var reg = new RegExp("(s|^)" + cls + "(s|$)");
    for (var i = 0; i < this.length; i++) {
        if (this[i].className.match(reg))
            this[i].className = this[i].className.replace(" " + cls,"");
    }
    return this;
}

然后新增一個

css : function(attr,val) {//鏈式測試
    console.log(this.length);
    for(var i = 0;i < this.length; i++) {
        if(arguments.length == 1) {
            return getComputedStyle(this[i],null)[attr];
        }
        this[i].style[attr] = val;
    }
    return this;
}

這些其實都很簡單,我們都要記住,我們封裝的DOM對象是一個數組,所以一定都需要用循環來進行各種個樣的處理.

然后css這我是用arguments的個數來進行判斷是取值還是設值.

最后千萬別忘了每個方法的最后都要return this以便鏈式調用.

大家可以自行拿這幾個方法 log出來看看是否是與jQuery的一樣就知道是否成功了.

您的star就是我快速更新的動力 : )

github地址: https://github.com/MeCKodo/forchange/tree/master/lesson-1
可想造一個屬于你自己的jQuery庫?(一)：http://segmentfault.com/a/1190000003994531

GPU云服務器云服務器如何搭建屬于自己的網站賺錢一個教你開發小程序的小程序阿里云的服務器是自己造的嗎云服務器怎么解決你正嘗試從不屬于

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/111195.html

可想造一個屬于你自己的jQuery庫?(二)

摘要：初步體驗這個版本呢先來加四個很簡單的方法感受感受下首先個不用說了然后新增一個鏈式測試這些其實都很簡單我們都要記住我們封裝的對象是一個數組所以一定都需要用循環來進行各種個樣的處理然后這我是用的個數來進行判斷是取值還是設值最后千萬別忘了每個方 Lesson-1 初步體驗這個版本呢,先來加四個很簡單的方法感受感受下! 首先3個class不用說了 hasClass : function(c...

gityuan 2019-08-21 10:47 評論0 收藏0
可想造一個屬于你自己的jQuery庫?(二)

摘要：初步體驗這個版本呢先來加四個很簡單的方法感受感受下首先個不用說了然后新增一個鏈式測試這些其實都很簡單我們都要記住我們封裝的對象是一個數組所以一定都需要用循環來進行各種個樣的處理然后這我是用的個數來進行判斷是取值還是設值最后千萬別忘了每個方 Lesson-1 初步體驗這個版本呢,先來加四個很簡單的方法感受感受下! 首先3個class不用說了 hasClass : function(c...

stefanieliang 2019-08-01 14:55 評論0 收藏0
可想實現一個自己的簡單jQuery庫？(四)

摘要：修改里的判斷新增我們知道在中還有一種選擇器寫法在加載完畢后馬上就執行這樣的方法會比更快所以對于我們來說一定是必不可少的我們在方法中要新增以下判斷首先可能為的情況比如傳入的是原生對象數組對象另外要記得轉為數組因為有可能是一個元素比如是等否則 Lesson-3 修改f(selector) 里的判斷,新增domReady 我們知道在jQuery中還有一種選擇器寫法 $(function()...

wangbjun 2019-08-21 10:48 評論0 收藏0