差異
在實際項目開發中，經常會出現通過點選某個按鈕擷取上個父級節點的一些屬性，我經常使用parents（），但是如果出現同一個代碼塊下相同父級節點出現多次，用parents（）就會出現問題，下面舉例說明：
<ul>
<li data-name="li1">
<p>xx</p>
<li data-name="li2">
<button id="sub">送出</button>
</li>
</li>
</ul>
上面這段代碼，目前我們希望通過點選送出按鈕擷取到name為li2的li元素，但是如果使用parents（），得到的将會是name為li1的元素節點，就是因為parents是從出現li元素的根節點開始的，這段代碼，第一次出現li的地方就是name為li1的節點，是以會出現這種情況，這個時候就需要使用closest（）來擷取，這個方法是比對最近的一個元素為li的父級節點，自然而然就是name為li2的那個li，如果對上段代碼加以修改，變成如下：
<ul>
<li data-name="li1">
<button id="sub">送出</button>
</li>
</ul>
這個時候，使用parents（）和closest（）得到的結果就是相同的！