假设我们要获取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,只需改一下代码即可(图十):
网友评论