在前端開發(fā)中，經(jīng)常需要通過jQuery獲取某個(gè)元素的父級(jí)元素。jQuery提供了parent()、parents()、closest()三種方法來實(shí)現(xiàn)這個(gè)功能。下面分別介紹一下它們的用法和區(qū)別。

//parent()
$(this).parent(); //獲取當(dāng)前元素的直接父級(jí)元素
//parents()
$(this).parents(); //獲取當(dāng)前元素的所有父級(jí)元素
//closest()
$(this).closest(selector); //獲取匹配selector選擇器的第一個(gè)祖先元素

使用這三個(gè)方法時(shí)需要注意的是，它們獲取的父級(jí)元素是不一樣的。

parent()方法只會(huì)獲取當(dāng)前元素的直接父級(jí)元素，如果要獲取父級(jí)元素的父級(jí)元素，需要多次調(diào)用該方法。而parents()方法可以獲取當(dāng)前元素的所有父級(jí)元素，包括直接和非直接的，一直往上直到document。

closest()方法會(huì)在當(dāng)前元素及其祖先元素中匹配選擇器，返回匹配元素中離當(dāng)前元素最近的一個(gè)，如果沒有匹配到，則返回一個(gè)空的jQuery對(duì)象。

// 區(qū)別演示< div class="grandfather">< div class="father">< p class="child">Hello World!