自制jquery API

window.jQuery = (nodeOrSelector) => {
    let o = {}
    if (typeof nodeOrSelector === "string") {
        let nodes = document.querySelectorAll(nodeOrSelector)
        nodes.forEach((node,i) => {
            o[i] = node
        })
        o.length = nodes.length

    } else if (nodeOrSelector instanceof Node) {
        o = {
            0: nodeOrSelector,
            length: 1
        }
    }
    o.addClass = (cls) => {
        for (let i = 0; i < o.length; i++) {
            o[i].classList.add(cls)
        }
        return o
    }
    o.setText = (text) => {
        for (let i = 0; i < o.length; i++) {
            o[i].textContent = text
        }
        return o
    }
    return o
}

jquery函数既可以接受节点作为参数,也可接受选择器字符串作为参数,然后创建一个对象o,如果参数是选择器字符串,那么用querySelectorAll返回nodes伪数组,遍历nodes,把它加入o中,同时制定length,如果参数是节点对象,也把它加入o中,同时制定length。然后创建两个api放在o中。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,281评论 0 21
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,259评论 19 139
  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 4,256评论 0 13