javascript - 寻找姐妹元素

Question

<div class="videoItem">
    <div class="innerVideoItem">
         <a><div class="overlayBg"></div></a>
         <a><img class="overlayPlay"><img></a>
    </div>
</div>
<script>
    $(".overlayPlay").hover(function(){
          // How do I find overlayBg here?
    });
</script>

如何在不使用的情况下访问 .overlayBg $(".overlayBg")？

Answer 1

在你的标记overlayBg和overlayPlay不是兄弟姐妹，他们是堂兄弟，你可以使用closest和find方法。

$(".overlayPlay").hover(function(){
    $(this).closest('.innerVideoItem').find('.overlayBg');
    // $(this).parent().prev().find('.overlayBg')
});

Answer 2

在本机 javascript 中，获取前一个元素的方法是（在您的事件处理程序中）：

this.parentElement.previousElementSibling.firstElementChild

Answer 3

你的意思是：

 $(".overlayPlay").hover(function(){
      $(this).parents("div.innerVideoItem").find("div.overlayBg");
 });