简单手写一个jqurey

复制代码
 1 /**
 2  * @description 手写jquery
 3  * @author ddxldxl
 4  */
 5 class Jquery {
 6     constructor(selector) {
 7         //遍历dom树
 8         let res = document.querySelectorAll(selector)
 9         let length = res.length
10         for( let i=0; i<length; i++) {
11             this[i] = res[i]
12         }
13         this.length = length
14         this.elements = res
15     }
16 
17     get(index) {
18         return this[index]
19     }
20 
21     each(fn) {
22         for( let i=0; i<this.length; i++ ) {
23             let elment = this[i]
24             fn(elment)
25         }
26     }
27 
28     on(type, fn) {
29         return this.each(elem => {
30             elem.addEventListener(type, fn, false)
31         })
32     }
33 }
34 
35 //原型扩展
36 Jquery.prototype.dialog = function (){
37     alert(123)
38 }
39 
40 //继承扩展
41 class myJquery extends Jquery {
42     constructor(selector) {
43         super(selector)
44     }
45 
46     addClass(){
47 
48     }
49 
50     style(){
51 
52     }
53 }
复制代码

 

posted @   musicBird  阅读(44)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~
点击右上角即可分享
微信分享提示