美文网首页
饥人谷模拟jq过程感想

饥人谷模拟jq过程感想

作者: xiaoznz | 来源:发表于2018-07-22 22:49 被阅读0次

    今天我学了老方的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的新语法

    大致思路就是这样了。

    相关文章

      网友评论

          本文标题:饥人谷模拟jq过程感想

          本文链接:https://www.haomeiwen.com/subject/pybrmftx.html