javascript - クリック時に子要素を非表示

Question

「thead」をクリックして「arrow_o」を非表示にしようとしていますが、機能しません。jquerysの「子」はテーブルで機能しませんか？

html

<thead class="thead">
  <tr>
    <th>
      <div class="arrow_o"></div>
    </th>
  </tr>
</thead>

js

$(document).ready(function() {
  $('.thead').click(function() {
    $(this).children('.arrow_o').hide();
  });
});

score 5 · Accepted Answer

.children（）メソッドは.find（）とは異なり、.children（）はDOMツリーを1レベル下に移動するだけですが、.find（）は複数のレベルを下に移動して、子孫要素（孫など）も選択できます。

したがって、この：

$(document).ready(function() {
  $('.thead').click(function() {
    $(this).find('.arrow_o').hide();
  });
});

score 2 · Accepted Answer

$('.arrow_o', this).hide();基本的に、arrow_oが配置されるべきコンテキストを設定するものを試してください。

完全なコード：

$(document).ready(function() {
  $('.thead').click(function() {
     $('.arrow_o', this).hide();
  });
});

score 2 · Accepted Answer

.children（）メソッドは.find（）とは異なり、.children（）はDOMツリーを1レベル下に移動するだけですが、.find（）は複数のレベルを下に移動して、子孫要素（孫など）も選択できます。

代わりに.find（）を使用してください。

3 に答える 3