一个简单的手写jquery
let $ = jQuery = (function () {
// 伪构造函数,用于jquery对象
function construct(dom, selector) {
let i, len = dom ? dom.length : 0
for (i = 0; i < len; i++)
this[i] = dom[i]
this.length = len
this.selector = selector
return this;
}
// jQuery函数返回的对象类型
function X(elements, selector) {
return construct.call(this, elements, selector)
}
// 添加一些原型方法
X.prototype = {
// 用于遍历对象中的dom树
each(callback) {
Array.prototype.forEach.call(this, function (el, index) {
callback.call(this, index, el)
})
},
find(selector) {
let doms = [];
this.each(function (index, el) {
let childs = el.querySelectorAll(selector);
doms.push(...childs);
})
return new X(doms, selector)
},
eq(i) {
let doms = [];
this.each(function (index, el) {
if (i === index) {
doms.push(this);
}
})
return new X(doms, this.selector)
},
remove() {
this.each(function (index, el) {
this.remove();
})
}
}
function $(selector) {
let doms = document.querySelectorAll(selector)
return new X(doms, selector)
}
// 静态方法
function isFunction(value) { return typeof value === 'function' }
$.isFunction = isFunction;
return $;
})()
本文来自博客园,作者:Bin_x,转载请注明原文链接:https://www.cnblogs.com/Bin-x/p/16028694.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)