如果此 class 包含，则隐藏其他 class 内容

Question

<div class="product_discountprice" id="product_discountprice1">
    <font color="red">
        <b style="font-size: 20px; font-weight: bold;">VIP Price:
            <p class="listpriceonGrid">List Price</p>
        </b>
    </font>
    <font class="pricecolor colors_productprice">.00</font>
</div>

他们在网站上有此代码。您可以在此处查看实际站点 --> https://www.colonialacres.com/category-s/928.htm 您会看到有些商品有 VIP 价格和标价，有些商品没有 VIP 价格。我想做的是，如果商品有 VIP 价格，则隐藏 "List Price" 文本，但如果没有 VIP 价格文本，则标价应该在那里。任何想法、建议和帮助将不胜感激。

我不太擅长 javascript 尤其是在 if-else 方面。我之前试过：

<script type="text/javascript">
$(window).load(function(){
    if ($('.product_discountprice font b:contains("VIP Price:")')) {
        $('.product_discountprice font b p').css("display","none");
    }
});
</script>

但是没有用。所以请帮忙。

Answer 1

条件 if 将始终为真，因为对象 (jQuery) 是 JavaScript 中的真值。尽管 $('.product_discountprice font b p') 会 select 所有与 if 条件无关的元素。

相反，组合 selector 并将 CSS 应用于元素。

$('.product_discountprice font b:contains("VIP Price:") p').css("display","none");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="product_discountprice" id="product_discountprice1">
  <font color="red">
    <b style="font-size: 20px; font-weight: bold;">VIP Price:
            <p class="listpriceonGrid">List Price</p>
        </b>
  </font>
  <font class="pricecolor colors_productprice">.00</font>
</div>

<script type="text/javascript">
  $(window).load(function() {
    if ($('.product_discountprice font b:contains("VIP Price:")')) {
      $('.product_discountprice font b p').css("display", "none");
    }
  });
</script>

如果此 class 包含，则隐藏其他 class 内容

if this class contains, then hide other class content

javascript

css

jquery

if-statement

show-hide