Question

我想知道sibling（）函数的要求是什么。例如，如果html如下所示，哪个选择器将出现在参数（）中，并且我的目标是现在的div类，你可以详细解释一下哪个父元素或者假设参数是什么。谢谢所有帮助表示赞赏

   $(function(){
          $(".target").click(function(){
              $(this).siblings(".a_cont").slideDown(100);
          });
   })

<div class='yes'>
  <div class='what'> 
    <button class='target'> </button>
    <div class='now'> </div>
  </div>
</div>

<div class='yes'>
<div class='what'> 
    <button class='target'> </button>
    <div class='now'> </div>
  </div>
</div>

Answer 1

jQuery API文档通常非常有用。 This是.siblings（）上的页面。

文档说明：

给定一个表示一组DOM元素的jQuery对象，.siblings（）方法允许我们在DOM树中搜索这些元素的兄弟，并从匹配元素构造一个新的jQuery对象。

该方法可选地接受我们可以传递给$（）函数的相同类型的选择器表达式。如果提供了选择器，则会通过测试元素是否与之匹配来过滤元素。

所以你从jQuery对象开始，例如你的例子中的$(this)。 .siblings()将在DOM树中找到所有兄弟元素，结果是一个新的jQuery对象。选择器允许您过滤掉元素。因此，要从具有处理程序的按钮执行您想要的代码：

$(this).siblings(".now");

现在把班级作为过滤器。

Answer 2

你可以试试这个：的CSS：

.now {
    width:100%; 
    height:100px; 
    display:none;
 }

html：目标 target.sibling

<div class="yes">
    <div class="what">
        <button class="target">target</button>
        <div class="now">target.sibling</div>
    </div>
</div>

js：

 $(function () {
            $(".target").click(function () {
                $(this).siblings().slideDown(100);
            });          
        })

兄弟姐妹功能

2 个答案: