假設我們要獲取item3的所有兄弟節(jié)點趁矾,我們就要找到item3的父節(jié)點之后再找到他的兒子節(jié)點并且遍歷他們(如圖一)
圖一
但是輸入的節(jié)點不能寫死石咬,因此我們將上年的for循環(huán)和聲明封裝成一個函數(shù)酝陈,這樣我們輸入哪個節(jié)點就都能獲取到他的兄弟節(jié)點了(圖二)
圖二
接下來假設我們需要同時在一個節(jié)點上面添加多個class的話觅够,我們可以使用forEach方法遍歷所有class并且把他們一個個都添加到節(jié)點上(圖三)
圖三
為以上兩個方法函數(shù)統(tǒng)一添加到一個地方即命名空間(圖四)
圖四卿捎,命名空間
但是實際上使用的話我們的第一直覺是喜歡寫item3.getSiblings/item3.addClass 而不是sdom.getSiblings(item3)/sdom.addClass(item3)
方法一:改原型鏈爽篷。直接在 Node.prototype 上加函數(shù)(圖五)
圖五
但是這種方法若每個人都改原型鏈那原型鏈就都亂了绑咱,因此還有以下方法:
方法二:增加新的接口(圖六)
框架如下:新增一個接口叫Node2.Node2是一個對象绰筛,里面有兩個key分別叫g(shù)etSiblings和addClass。然后我們聲明node2去存這個對象的地址(回憶一下之前學習原型鏈)
圖六
把上面兩個方法函數(shù)添加到框架里面描融,得到:
圖七
我們把Node2換一個名字叫jQuery铝噩。jQuery比較強大,除了可以輸入節(jié)點之外還可以輸入選擇器(圖八):
圖八
把getSiblings方法換成text方法(圖九):
圖九
如果我們想在所有的節(jié)點上都添加一樣的class窿克,只需改一下代碼即可(圖十):