は別のspan要素は、特定のテキスト

Question

が含まれている場合、私はhidden-skuが「020から01119」に等しい場合にのみ、class=".basket__item-cell.basket__item-qty"でのdivを削除しようとしているのdiv兄弟取り外します。

私は、.each（関数）または.next（）を使ってさまざまなアプローチを試しましたが、その周りに頭を浮かべることはできませんでした。この例を説明するために、コードを追加しました。

IDやクラスを追加することはできません。行の順序はさまざまです。

(function($) { 
 
    $('.hidden-sku').filter(function() { 
 
    return $(this).text().indexOf("020-01119") !== false; 
 
    }).closest(".basket__item-cell.basket__item-name").next(".basket__item-cell.basket__item-qty").remove(); 
 
})(jQuery)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<div class="basket__item-data basket__item-data--right"> 
 
    <div class="basket__item-cell basket__item-name"> 
 
    <h2 class="product-name">One </h2> 
 
    <span class="hidden-sku">020-01119</span> 
 
    </div> 
 
    <div class="basket__item-cell basket__item-price"> 
 
    <span class="cart-price"><span class="price"><span class="currency"></span>18</span> 
 
    </span> 
 
    </div> 
 
    <div class="basket__item-cell basket__item-qty"> 
 
    <div class="input-combobox main-input-combobox input-combobox__with-qty" data-label="Qty" data-range-min="1" data-range-max="12">1 
 
    </div> 
 
    </div> 
 
</div> 
 

 
<div class="basket__item-data basket__item-data--right"> 
 
    <div class="basket__item-cell basket__item-name"> 
 
    <h2 class="product-name">Two </h2> 
 
    <span class="hidden-sku">020-01117</span> 
 
    </div> 
 
    <div class="basket__item-cell basket__item-price"> 
 
    <span class="cart-price"><span class="price"><span class="currency"></span>18</span> 
 
    </span> 
 
    </div> 
 
    <div class="basket__item-cell basket__item-qty"> 
 
    <div class="input-combobox main-input-combobox input-combobox__with-qty" data-label="Qty" data-range-min="1" data-range-max="12">2 
 
    </div> 
 
    </div> 
 
</div> 
 

 
<div class="basket__item-data basket__item-data--right"> 
 
    <div class="basket__item-cell basket__item-name"> 
 
    <h2 class="product-name">Three </h2> 
 
    <span class="hidden-sku">020-01118</span> 
 
    </div> 
 
    <div class="basket__item-cell basket__item-price"> 
 
    <span class="cart-price"><span class="price"><span class="currency"></span>18</span> 
 
    </span> 
 
    </div> 
 
    <div class="basket__item-cell basket__item-qty"> 
 
    <div class="input-combobox main-input-combobox input-combobox__with-qty" data-label="Qty" data-range-min="1" data-range-max="12">3 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

これは、仕事をすると、間違いなくそれは一目でやっているかを理解する方が簡単です。

また、SKUが常に020-01119になり、その文字列を含むことは決してないと仮定していますか？そうでない場合は、indexOfをif条件に戻します。

(function($) { 
    $('.basket__item-data').each(function() { 
    var sku = $('.hidden-sku', this); 

    if (sku.text() === '020-01119') { 
     $('.basket__item-cell.basket__item-qty', this).remove(); 
    } 
    }); 
})(jQuery); 

Answer 2

あなたがindexOf()を使用して文字列の存在を確認する方法をつけろ：

(function($) { 
    $('.hidden-sku').filter(function() { 
    return $(this).text().indexOf("020-01119") > -1; 
    }).closest(".basket__item-cell.basket__item-name").next(".basket__item-cell.basket__item-qty").remove(); 
})(jQuery) 

Answer 3

​​

.next()そしてちょうど非常に次のDOMノード、を取得し、指定したクラス（複数可）と比較します。あなたのケースでは

、あなたが-price

<div class="basket__item-cell basket__item-name"> 
<div class="basket__item-cell basket__item-price"> 
<div class="basket__item-cell basket__item-qty"> 

-name間と-qtyを持っているので、それは、-priceあると言う、それがされていない、この-qtyである、次のようにあなたを与える、その後-nameを取得します.remove()には一致しません。ここで

.nextを置き換えるためにいくつかのアイデア（）は次のとおりです。

// Use nextAll() 
.closest(".basket__item-cell.basket__item-name") 
.nextAll(".basket__item-cell.basket__item-qty") 
.remove(); 

// Use nextAll().first() if you there might be more 
.closest(".basket__item-cell.basket__item-name") 
.nextAll(".basket__item-cell.basket__item-qty") 
.first() 
.remove(); 

// use .siblings 
.closest(".basket__item-cell.basket__item-name") 
.siblings(".basket__item-cell.basket__item-qty") 
.remove(); 

// Go up to parent, then down 
// Most likely to work if the structure changes 
.closest(".basket__item-cell.basket__item-name") 
.parent() 
.find(".basket__item-cell.basket__item-qty") 
.remove(); 

// Go up to parent in one step, then down 
// Most likely to work if the structure changes 
.closest(".basket__item-data") 
.find(".basket__item-cell.basket__item-qty") 
.remove();