javascript - 单击时隐藏子元素

Question

我试图在单击“头”时隐藏“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();
  });
});

score 5 · Accepted Answer

.children() 方法与 .find() 的不同之处在于 .children() 仅沿 DOM 树向下移动一个级别，而 .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 树向下移动一个级别，而 .find() 也可以向下遍历多个级别以选择后代元素（孙子等）。

使用.find()代替。

3 回答 3