jQuery：选择祖父母

Question

有没有更好的方法来选择jQuery中的祖父母元素，以避免这种情况？

$(this).parent().parent().parent().parent().parent().children(".title, .meta").fadeIn("fast"); 

谢谢。

Answer 1

如果你使用1.4有一个新的parentsUntil()方法

http://api.jquery.com/parentsUntil/

Answer 2

使用parents()您可以使用它匹配家长对选择

http://api.jquery.com/parents/

还是parents()方法选择器获取元素的所有父项。然后，您可以搜索该集合，或者如果要影响所有祖先，可以对其进行迭代。

Answer 3

除了parents()，正如他们所说，你也应该check out closest()。在那里的文档中阅读比较，但它的主要区别在于它只搜索一个结果，它包括$(this)它的搜索结果（如果你不够详细，可以从中找到你要搜索的东西）。优点和缺点。

Answer 4

我写了这个简单的插件，因为我认为我有一个明确的类选择某处给我的错误。对于这种特殊情况，选择祖父母似乎比$().parents()更直接。

那么，我用这一次然后意识到我实际上有一个拼写错误。不知道它真的有多大帮助。 $('myelem').gparent(2);让你成为'myelem'的祖父母。

(function($){ 
$.fn.gparent = function(recursion){ 
    if(recursion == undefined) recursion = 2; 
    if(typeof(recursion) == "number"){ 
     recursion = parseInt(recursion); 
     if(recursion > 0){ 
      gparent_holder = $(this); 
      for(var gparent_i = 0; gparent_i < recursion; gparent_i++){ 
       gparent_holder = gparent_holder.parent(); 
      } 
      return gparent_holder; 
     } 
     else return false; 
    } 
    else return false; 
} 
})(jQuery); 

Answer 5

@Femi有了答案要做到这一点，并提到递归，但他的解决办法是不递归的，以下是获取项目的祖先递归jQuery的解决方案：

$.fn.gparent = function(recursion){ 
    console.log('recursion: ' + recursion); 
    if(recursion > 1) return $(this).parent().gparent(recursion - 1); 
    return $(this).parent(); 
}; 

如果这是你的HTML：

<div id='grandparent'> 
    <div id='parent'> 
    <div id='child'> 
     child 
    </div> 
    </div> 
</div> 

您可以拨打

console.log($('#child').gparent(2)); 

得到元素child的祖父母。 Here's the JSFiddle