Question

我想要隐藏特定div （示例2），但它没有类或ID，因此我无法在该特定div上应用jquery（示例2）...请指导我可以用jquery隐藏该div。

这是我的div结构：

<div class="purhist-desc-col">
  <h5>Heading Sample</h5>
  <div class="purchase-price"></div>
  <div>Example 1</div>
  <div class="booking-hide-on-wholeday">00:00 Check-out 00:00</div>
  <div>Example 2</div>
  <div>Example 3</div>
</div>

Answer 1

您可以使用DOM关系并使用其兄弟姐妹定位所需元素。

＆＃13;

data want;
  set have;
  by id;
  if first.id 
    then year = 2017; %* initial year for a group;
    else year + 1; %* increment year for subsequent rows of a group;
run;

＆＃13;

$('.booking-hide-on-wholeday').next().hide()

＆＃13;

Answer 2

您可以通过+（下一个）选择器实现此目的。

＆＃13;

$(document).ready(function(e) {
      $('.booking-hide-on-wholeday + div').hide();
 });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="purhist-desc-col">
<h5>Heading Sample</h5>
<div class="purchase-price"></div>
<div>Example 1</div>
<div class="booking-hide-on-wholeday">00:00 Check-out 00:00</div>
<div>Example 2</div>
</div>

＆＃13;

Answer 3

为什么jQuery如果我们可以使用CSS轻松完成：

.purhist-desc-col>div:nth-child(5) {
  display: none;
}
/* OR
booking-hide-on-wholeday + div {
  display: none;
}
*/

<div class="purhist-desc-col">
  <h5>Heading Sample</h5>
  <div class="purchase-price"></div>
  <div>Example 1</div>
  <div class="booking-hide-on-wholeday">00:00 Check-out 00:00</div>
  <div>Example 2</div>
  <div>Example 3</div>
</div>

Answer 4

您可以选择.purhist-desc-col div:last-of-type的div，因为您需要定位该容器中的最后一个div，因此jQuery代码将是

$('.purhist-desc-col div:last-of-type').hide()

和 vanillaJS

document.querySelector('.purhist-desc-col div:last-of-type').style.display = 'none'

Answer 5

为此，你必须为它编写一个lineer jquery代码。

$('div.booking-hide-on-wholeday').next('div').hide();

这将解决您的问题。

由于

隐藏一个没有Jquery类的特定Div

5 个答案: