可想實現一個自己的簡單jQuery庫？(四)

wangbjun 發布于2019-08-21 10:48 / 3007人閱讀

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

Lesson-3

修改f(selector) 里的判斷,新增domReady

我們知道在jQuery中還有一種選擇器寫法

$(function() {

});

在dom加載完畢后馬上就執行,這樣的方法會比onload更快,所以domReady對于我們來說一定是必不可少的

我們在init方法中要新增以下判斷

if(!selector) { return this; }

if (typeof selector == "object") {
    var selector = [selector];
    for (var i = 0; i < selector.length; i++) {
        this[i] = selector[i];
    }
    this.length = selector.length;
    return this;
} else if (typeof selector == "function") {
    Kodo.ready(selector);
    return;
}

首先selector可能為object的情況,比如傳入的是原生dom對象,dom數組對象. 另外要記得轉為數組`var selector = [selector];

因為有可能是一個元素比如是window,document等否則沒法循環

然后selector如果是function那我們就認為他是domReady

PS:在這我判斷的并沒有非常的全面,僅僅具備了基礎功能

Kodo.ready = function(fn) {

    doc.addEventListener("DOMContentLoaded",function() {
        fn && fn();
    },false);
    doc.removeEventListener("DOMContentLoaded",fn,true);

};

然后這個是ready的源碼,由于我們只兼容高端瀏覽器所以僅僅需要這樣寫即可.

既然你都看到這了,還不給我一個star說得過去么你!! :(

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

GPU云服務器云服務器 js實現的簡單特效怎么搭建一個自己的視頻網站如何搭建一個自己的服務器用c實現簡單的shell

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

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

可想實現一個自己的簡單jQuery庫？(五)

摘要：這個版本我們要增加一個用的非常多的方法那就是我們知道不僅能遍歷數組還能遍歷對象首先我們需要一個對數組進行驗證的方法接著就是我們的重頭戲因為我們還可能遍歷數組對象如所以還需要一個判斷是否是數組對象在這應該強調下的用法還是很多人不知道何時使用 Lesson-4 這個版本我們要增加一個用的非常多的方法! 那就是each! 我們知道each不僅能遍歷數組,還能遍歷對象. 首先我們需要一個對數...

mindwind 2019-08-21 10:48 評論0 收藏0
可想實現一個自己的簡單jQuery庫？(五)

摘要：這個版本我們要增加一個用的非常多的方法那就是我們知道不僅能遍歷數組還能遍歷對象首先我們需要一個對數組進行驗證的方法接著就是我們的重頭戲因為我們還可能遍歷數組對象如所以還需要一個判斷是否是數組對象在這應該強調下的用法還是很多人不知道何時使用 Lesson-4 這個版本我們要增加一個用的非常多的方法! 那就是each! 我們知道each不僅能遍歷數組,還能遍歷對象. 首先我們需要一個對數...

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

摘要：這個版本新增這個選擇元素的方法還是比較常用的首先我們需要一個來過濾我們需要的上面那段比較簡單就是普通的過濾下元素看下方法的源碼就知道我傳入數組對象的個對象然后取它的下一個同輩元素直接返回方法同理這段是取到第一個父元素由于返回的不是原生的對 Lesson-2 這個版本新增 next(),prev(),parent(),parents() 這4個選擇元素的方法還是比較常用的首先我們需要...

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