單擊時隱藏子元素

Question

我試圖在單擊“ thead”時隱藏“ arrow_o”，但是它不起作用。 jQuery“子級”在表中不起作用嗎？

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();
  });
});

Answer 1

.children（）方法與.find（）的不同之處在於，.children（）僅沿DOM樹向下移動一個級別，而.find（）可以向下遍歷多個級別以選擇后代元素（孫子等）。

所以這：

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

Answer 2

嘗試$('.arrow_o', this).hide(); 這基本上設置了應該放置arrow_o的上下文。

完整代碼：

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

Answer 3

.children（）方法與.find（）的不同之處在於，.children（）僅沿DOM樹向下移動一個級別，而.find（）可以向下遍歷多個級別以選擇后代元素（孫子等）。

jQuery兒童

使用.find（）代替。