今天我学了老方的jq的构成过程,并且后来自己也看了原码,也自己尝试的写了一下,应该说还是得到了不少的收获。这里就简单阐述一下我写的两个jq方法时的想法。
首先上代码:
老方的要求是:
因为第三句是(var $div = $('div'))因此对前两句,明显是叫我构建一个方法,这个方法需要我传一个参数,得到这个参数所对应的dom节点的对象。但是如果我此时对这个对象加上addClass()和setText(),那么可能会覆盖原有的dom节点所对应的方法,于是我重新定义了一个空数组,然后将它当做返回值并在这个数组上添加addClass()和setText()。于是我就用了querySelectAll方法来找到,但有时我会遇到直接给我一个dom对象,所以我做了一个条件判断,如果是字符串,就遍历querySelectAll方法找到的对象,加入空对象,如果不是,那么将参数节点加入,然后进行遍历
第一个要求我们把所有的div的class添加一个red。那就遍历对象然后在每个对象的dom属性classList上运用add()方法,让他传一个参数,这个参数就添加在class上即可。
第二个要求我们让所有div的textContent变为hi,方法与第一个类似,这次我们换成了用textContent属性赋值来做,也成功了
我这两个方法,都用到了闭包思想,即在函数内部没有这个变量的情况下,用到函数外部变量,比如jq.length,jq[i]
然后用到了一些es6的新语法
大致思路就是这样了。
网友评论