jQuery select 同一父元素中具有某些 class 的另一个元素

Question

假设我有这个div

<div id='parent'>
  <button id='button'></button>
  <div id='child'>
     <div id='grandchild' class='lookAtMe'>
          Some JSON text
     </div>
  </div>
</div>

我想给#button 一个点击事件，返回#lookAtMe div 处的文本，特定于它共享parent/grandparent 的div（在本例中， #parent div)

我尝试使用：

 $("#button").on("click",function(){
     var ReturnedText = $(this).parent(".lookAtMe").text();
     console.log(RetrunedText);
 });

但是控制台日志会重新显示（空字符串）。

我哪里做错了？请帮忙。非常感谢。

Answer 1

因为 class 没有 parent。你需要 find().

其实你需要写

 var ReturnedText = $(this).parent().find(".lookAtMe").text();

 $("#button").on("click",function(){
     var ReturnedText = $(this).parent().find(".lookAtMe").text();
     console.log(ReturnedText);
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='parent'>
  <button id='button'></button>
  <div id='child'>
     <div id='grandchild' class='lookAtMe'>
          Some JSON text
     </div>
  </div>
</div>

jQuery select 同一父元素中具有某些 class 的另一个元素

jQuery select another element with certain class in same parent

html

javascript

jquery

jquery-selectors