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 }