包含特定类的 div 的 jquery 选择器

Question

我正在尝试选择此页面上由 Amazon Prime 发货的商品表中第一行的 DIV。

http://www.amazon.co.uk/gp/offer-listing/B00NMND7AW/?condition=new

所以在本例中，我尝试使用 jQuery 选择的行是 £25.19

我尝试了以下方法：

div.olpOffer .a-icon-prime:first

这让我到目前为止。现在我需要弄清楚如何选择包含它的 div。

我需要能够将其粘贴到 Chrome 的 Selector Gadget 插件中，它应该选择包含最便宜的 Amazon Prime 商品的 div。

Answer 1

听起来您正在寻找:has() selector：

$('.olpOffer:has(.a-icon-prime):first');

这将选择第一个 .olpOffer 元素，该元素具有一个类为 .a-icon-prime 的元素。

Answer 2

我建议

$(".supersaver").closest("div.olpOffer")

它选择行：

<div class="a-row a-spacing-mini olpOffer">
  <div class="a-column a-span2">

    <span class="a-size-large a-color-price olpOfferPrice a-text-bold">            £25.19            </span>
    <span class="a-color-price">
            
        </span>
    <span class="supersaver"><i class="a-icon a-icon-prime" aria-label="Amazon Prime TM"><span class="a-icon-alt">Amazon Prime TM</span>
    </i>
    </span>


    <p class="olpShippingInfo">
      <span class="a-color-secondary">
                Eligible for FREE UK Delivery <a href="/gp/help/customer/display.html/ref=mk_gship_olp?ie=UTF8&amp;nodeId=200039400&amp;pop-up=1" target="SuperSaverShipping" onclick="return amz_js_PopWin('/gp/help/customer/display.html/ref=mk_gship_olp?ie=UTF8&amp;nodeId=200039400&amp;pop-up=1','SuperSaverShipping','width=550,height=550,resizable=1,scrollbars=1,toolbar=0,status=0');">Details</a>

        </span>
    </p>

  </div>
  <div class="a-column a-span3">


    <div class="a-section a-spacing-small">
      <span class="a-size-medium olpCondition a-text-bold">
            New
        </span>
    </div>
  </div>
  <div class="a-column a-span2 olpSellerColumn">
    <h3 class="a-spacing-none olpSellerName">
            <img alt="Amazon.co.uk" src="http://ecx.images-amazon.com/images/I/01pSGAIMN3L.gif" width="90" height="19">
</h3>
  </div>
  <div class="a-column a-span3 olpDeliveryColumn">
    <p class="a-spacing-mini olpAvailability">
    </p>
    <ul class="a-vertical">
      <li class="olpFastTrack"><span class="a-list-item">
            In stock.  









<span id="ftm_us7UeOB4c9pZTmqq2Md4WubIlhxKT3k9uiwFnsOOTz6eaIxF2ReWmql9mIaXr5EWHB9hdFWHF3jDdpJB7I6iPIEhJZbrPX5z">Want delivery by Thursday, 3 December?




<span id="shippingMessage_ftinfo_olp_1">Order it in the next <span id="ftc_us7UeOB4c9pZTmqq2Md4WubIlhxKT3k9uiwFnsOOTz6eaIxF2ReWmql9mIaXr5EWHB9hdFWHF3jDdpJB7I6iPIEhJZbrPX5z" style="color: #006600;">19 hours and 10 minutes</span>, and choose <b>One-Day Delivery</b> at
        checkout.
        </span>






        <a href="/gp/help/customer/display.html/ref=ftinfo_olp_1?ie=UTF8&amp;nodeId=200275230&amp;pop-up=1" target="_blank" onclick="return amz_js_PopWin('/gp/help/customer/display.html/ref=ftinfo_olp_1?ie=UTF8&amp;nodeId=200275230&amp;pop-up=1','_blank','width=750,height=600,resizable=1,scrollbars=1,toolbar=1,status=1');">See details</a>

        </span>

        </span>
      </li>





      <li><span class="a-list-item">
            <a href="/gp/help/customer/display.html/ref=olp_merch_ship_1?ie=UTF8&amp;nodeId=492868">Domestic delivery rates</a>
                 and <a href="/gp/help/customer/display.html/ref=olp_merch_return_1?ie=UTF8&amp;nodeId=502480">return policy</a>.
        </span>
      </li>
    </ul>


    <p></p>








  </div>
  <div class="a-column a-span2 olpBuyColumn a-span-last">













    <div class="a-button-stack">
      <form method="post" action="/gp/item-dispatch/ref=olp_atc_new_1" class="a-spacing-none">
        <input type="hidden" name="session-id" value="275-2613291-9295018">
        <input type="hidden" name="qid">
        <input type="hidden" name="sr">
        <input type="hidden" name="signInToHUC" value="0" id="signInToHUC">
        <input type="hidden" name="metric-asin.B00NMND7AW" value="1">
        <input type="hidden" name="registryItemID.1">
        <input type="hidden" name="registryID.1">
        <input type="hidden" name="itemCount" value="1">
        <input type="hidden" name="offeringID.1" value="us7UeOB4c9pZTmqq2Md4WubIlhxKT3k9uiwFnsOOTz6eaIxF2ReWmql9mIaXr5EWHB9hdFWHF3jDdpJB7I6iPIEhJZbrPX5z">
        <input type="hidden" name="isAddon" value="0">

        <span class="a-declarative" data-action="olp-click-log" data-olp-click-log="{&quot;subtype&quot;:&quot;main&quot;,&quot;type&quot;:&quot;addToCart&quot;}">
                      <span class="a-button a-button-normal a-spacing-micro a-button-primary a-button-icon" id="a-autoid-6"><span class="a-button-inner"><i class="a-icon a-icon-cart"></i><input name="submit.addToCart" class="a-button-input" type="submit" value="Add to Basket" aria-labelledby="a-autoid-6-announce"><span class="a-button-text" aria-hidden="true" id="a-autoid-6-announce">
                          Add to Basket
                      </span></span>
        </span>
        </span>
      </form>

      <div class="a-section a-spacing-micro a-text-center">
        or
      </div>
      <p class="a-spacing-none a-text-center olpSignIn">
        <a href="https://www.amazon.co.uk/gp/product/utility/edit-one-click-pref.html/ref=olp_offerlisting_1?ie=UTF8&amp;returnPath=%2Fgp%2Foffer-listing%2FB00NMND7AW">Sign in</a> to turn on 1-Click ordering.
      </p>
    </div>

  </div>
</div>