搜索具有共同祖先的项目

Search for an item with a common ancestor

本文关键字:祖先 项目 搜索      更新时间:2023-09-26

我有这个html:

<div>
    <div><!-- all div without ID -->
        <span>some text</span>
        <div>
          <span id="listener1">click here</span>
          <span>sometext</span></div>
        <div>
        <span class="FIND_ME">Result Here</span></div>
    </div>
    <div>
        <span>some text</span>
        <div id="div1">
         <div id="div2">
          <span id="listener2">click here</span>
          <span>sometext</span></div>
         </div>
        <div>
        <span class="FIND_ME">Result Here</span></div>
    </div>
</div>

应该是以下逻辑:当我单击"单击此处"时,具有类"FIND_ME"的元素应该隐藏,这是按下按钮的最接近的共同祖先。可以这样做吗?

$("#listener1").click(function(){
    $(this).<SUPER_SEARCHING>.hide(); // for example hide, or add some CSS class
});

你可以找到最接近的包含元素.find_me的div:

$("#listener1").click(function(){
   $(this).closest('div:has(.FIND_ME)').find('.FIND_ME').hide();
});

工作演示