javascript - 如果子元素包含 href == 则隐藏子元素 #

Question

如果每个 #wrapper div.part 的 a href 属性等于 #，如何隐藏它？我尝试了这个，但它不起作用:

$("document").ready(function() {
  $('#wrapper > div.part a').each(function() {
    if (this == "#") {
      $(this).hide();
    } else {
      $(this).show();
    };
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 1</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 2</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 3</a>
  </div>
</div>

我是 jQuery 新手，很抱歉它是基础的。

Answer 1

为此，您可以通过 href 选择 a 元素，然后获取 closest() 父 .part 和 hide() 它。试试这个:

$('#wrapper .part a[href="#"]').closest('.part').hide();

$('#wrapper .part a[href="#"]').closest('.part').hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 1</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 2</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 3</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="somepage.html">Link 4</a>
  </div>
</div>

或者更简洁地说，感谢@T.J。克劳德:

$('#wrapper .part:has(a[href="#"])').hide();