jQuery入门（addClass()及text()方法实现）
2019-05-12 本文已影响0人
陈夏天0527
假设我们要获取item3的所有兄弟节点，我们就要找到item3的父节点之后再找到他的儿子节点并且遍历他们（如图一）
图一
但是输入的节点不能写死，因此我们将上年的for循环和声明封装成一个函数，这样我们输入哪个节点就都能获取到他的兄弟节点了（图二）
图二
接下来假设我们需要同时在一个节点上面添加多个class的话，我们可以使用forEach方法遍历所有class并且把他们一个个都添加到节点上（图三）
图三
为以上两个方法函数统一添加到一个地方即命名空间（图四）
图四，命名空间
但是实际上使用的话我们的第一直觉是喜欢写item3.getSiblings/item3.addClass 而不是sdom.getSiblings(item3)/sdom.addClass(item3)
方法一：改原型链。直接在 Node.prototype 上加函数（图五）
图五
但是这种方法若每个人都改原型链那原型链就都乱了，因此还有以下方法：
方法二：增加新的接口（图六）
框架如下：新增一个接口叫Node2.Node2是一个对象，里面有两个key分别叫getSiblings和addClass。然后我们声明node2去存这个对象的地址（回忆一下之前学习原型链）
图六
把上面两个方法函数添加到框架里面，得到：
图七
我们把Node2换一个名字叫jQuery。jQuery比较强大，除了可以输入节点之外还可以输入选择器（图八）：
图八
把getSiblings方法换成text方法（图九）：
图九
如果我们想在所有的节点上都添加一样的class，只需改一下代码即可（图十）：
