使用jquery进行dom结构移动

Question

我正在创建一个jquery脚本，如果单击某个link元素，下面div的css就会发生变化。我的问题是，下一个元素在“父dom树”中，我不知道如何选择它。

如果您看一下我下面的html示例，您就会知道这是什么意思。;)

<div class="box">
                        <div class="rentenBox"><a href="#" title="Info"><span class="hide">Info</span></a></div>
                        <div class="obereZeile"></div>
                        <div class="untereZeile"></div> 

</div> <!-- .box -->
<div class="blueButtonInfo"></div>

所以，如果用户点击.rentenBox a，.blueButtonInfo的css应该会改变。

到目前为止，我的jQuery如下：

$('.rentenBox a').click(function(event) {
                event.preventDefault();
                $(this).next('.blueButtonInfo').css('display', 'none');

            })

我感谢每一个人的帮助。Thx！:)

Answer 1

next div紧挨着box，因此您必须向上移动2个元素，然后调用blueButtonInfo

$(this).parent().parent().next('.blueButtonInfo').css('display', 'none');

//or

$(this).parents('.box').next('.blueButtonInfo').css('display', 'none');

Answer 2

$(this).parent().next().css('display', 'none');

或

$(this).parent().siblings('.blueButtonInfo').css('display', 'none');

如果您的目标div总是在当前div的父级之后，那么第一个方法将会起作用。如果div的类为blueButtonInfo，则第二个将始终有效。