javascript - closest() 没有选择元素

Question

HTML

  <h2 class="tm section-title margin-l-10">Normal Cards<button class="tm bg-dark btn-tiny margin-b-10 float-r js-show-code">show code</button></h2>
    <div class="grid-100">
      <code>
        &lt;div class=&quot;<span class="tm bg-win blue">tm card</span>&quot;&gt;
          <span class="tm lightyellow">...</span>
        &lt;/div&gt;
      </code>
    </div>

JAVASCRIPT (jQuery)

$('.js-show-code').click(function(){
  $(this).closest('code').slideToggle()
});

我仍在学习 Javascript 和 Jquery，我不知道我做错了什么。我无法选择<code>

它总是返回:[prevObject: r.fn.init[1]]

Answer 1

closest() 通过测试元素本身并在 DOM 树中向上遍历其祖先来获取与选择器匹配的第一个元素。您正在寻找与 button.js-show-code 无关的元素。

尝试

 $('.js-show-code').click(function(){
      $(this).closest('h2').next(".grid-100").find("code").slideToggle()
    });

这是fiddle