jQuery：如何到达父母的特定孩子？

为了给出一个简化的示例，我在页面上多次重复以下块（它是动态生成的）：

<div class="box">
   <div class="something1"></div>
   <div class="something2">
      <a class="mylink">My link</a>
   </div>
</div>

单击后，我可以通过以下方式转到链接的父级：

$(".mylink").click(function() {
   $(this).parents(".box").fadeOut("fast");
});

但是...我需要了解<div class="something1">该特定父级的。

基本上，有人可以告诉我如何直接引用高级兄弟吗？我们称它为大哥。直接引用大哥的类名将导致页面上该元素的每个实例淡出-这不是理想的效果。

我试过了：

parents(".box .something1") ... no luck.
parents(".box > .something1") ... no luck.
siblings() ... no luck.

任何人？谢谢。

调用.parents(".box .something1")将返回与选择器匹配的所有父元素.box .something。换句话说，它将返回中.something1和内的父元素.box。

您需要获取最亲父母的孩子，如下所示：

$(this).closest('.box').children('.something1')

此代码调用.closest以获取与选择器匹配的最里面的父对象，然后调用.children该父元素以查找您要查找的叔叔。

$(this).parent()

遍历树很有趣

$(this).parent().siblings(".something1");

$(this).parent().prev(); // if you always want the parent's previous sibling

$(this).parents(".box").children(".something1");

还有更多方法，您可能会发现这些文档很有用。

这将找到具有类的第一个父类，box然后找到具有正则表达式匹配的第一个子类something并获取ID。

$(".mylink").closest(".box").find('[class*="something"]').first().attr("id")

如果我正确理解了您的问题，$(this).parents('.box').children('.something1')这是您要找的东西吗？

您可以使用.each()与.children()和括号内的选择：

//Grab Each Instance of Box.
$(".box").each(function(i){

    //For Each Instance, grab a child called .something1. Fade It Out.
    $(this).children(".something1").fadeOut();
});