可想实现一个自己的简单jQuery库？(四)

wangbjun 发布于2019-08-21 10:48 / 2906人阅读

摘要：修改里的判断新增我们知道在中还有一种选择器写法在加载完毕后马上就执行这样的方法会比更快所以对于我们来说一定是必不可少的我们在方法中要新增以下判断首先可能为的情况比如传入的是原生对象数组对象另外要记得转为数组因为有可能是一个元素比如是等否则

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

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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