删除不具有特定descendandt元素在jQuery中的所有元素
所以我有以下的标记：删除不具有特定descendandt元素在jQuery中的所有元素
<div class="festi-cart-products-content">
<table class="festi-cart-list">
<tbody>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
<span class="woocommerce-Price-amount amount"></span>
</span>
</td>
</tr>
</tbody>
</table>
</div>
有多个TR元素，但只有一些具有“woocommerce - 价格 - 最里面的跨度数量“类。另一个在“festi-cart-product-price”分类的跨度之后没有任何东西。
我试图删除所有使用jQuery没有“woocommerce-Price-amount”跨度的tr元素。
jQuery(document).ajaxComplete(function() {
jQuery(".festi-cart-product-price:not(:has(>span))").each(function(){
jQuery(this).parent('tr.festi-cart.item').hide();
});
});
我一直在尝试使用：不是选择器，但它似乎并没有产生任何东西。我真的不确定它出错的地方。
你们中的任何一个都可以发现我的代码出错的地方，或者它对于一个简单的解决方案来说是完全没有希望的方法吗？
$('.btn').click(function(){
$('.festi-cart-item').each(function(){
var price = $(this).find('.festi-cart-product-price').children().hasClass('woocommerce-Price-amount');
if(!price)
$(this).hide();
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="festi-cart-products-content">
<table class="festi-cart-list">
<tbody>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
<span class="woocommerce-Price-amount"></span>
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
</span>
</td>
</tr>
</tbody>
</table>
</div>
<button class="btn">remove</button>谢谢，第一次尝试完美。只是改变了点击处理程序来记录在ajaxComplete :)。 –
这个怎么样。
$("tr:not(:has(>.woocommerce-Price-amount))").hide()
未测试。
来自这个问题：How to select elements which do not have a specific child element with JQuery这是值得一读这种'后裔没有功能'的问题。
从来没有真正可以得到的：没有功能的工作，所以我结束了其他答案之一。无论如何感谢您的意见！ –
您需要使用.closest()方法的jquery而不是.parent()方法。
感谢您的输入。 –
使用.filter函数来匹配具有特定要求的元素。
使用$('tr').find('.woocommerce-Price-amount').length > 0来检查元件是否存在于tr。
比简单地做.hide()（或.remove()）过滤元素。
$(document).ready(function() {
var hasWoo = $('.festi-cart-list tr').filter(function() {
return $(this).find('.woocommerce-Price-amount').length !== 0;
});
hasWoo.hide();
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="festi-cart-products-content">
<table class="festi-cart-list">
<tbody>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a>
<br>
<span class="festi-cart-product-price">
<span class="woocommerce-Price-amount amount">WOO</span>
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a>
<br>
<span class="festi-cart-product-price">
<span class="woocommerce-Price-amount amount">WOO</span>
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img">
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a>
<br>
<span class="festi-cart-product-price">
EMPTY
</span>
</td>
</tr>
</tbody>
</table>
</div>谢谢，对过滤功能有很好的了解。我需要针对所有非woocommerce类元素，所以这是相反的，但仍然是一个很好的解决方案。可能会尝试将其翻转并稍后使用，但现在我使用了其他人之一。再次感谢。 –
你是如此接近，你的选择是有效的并选择festi-cart-product-price有没有span的：
$(".festi-cart-product-price:not(:has('>span'))")
你刚刚去了给父母tr使用closest()然后隐藏它们：
selector.closest('tr').hide();
检查This fiddle使用setTimeout()查看效果。
希望这会有所帮助。
$(function() {
var selector = $(".festi-cart-product-price:not(:has('>span'))");
selector.closest('tr').hide();
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="festi-cart-products-content">
<table class="festi-cart-list" border=1>
<tbody>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img"> IMAGE 1
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
<span class="woocommerce-Price-amount amount">p1</span>
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img"> IMAGE 2
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img"> IMAGE 3
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
</span>
</td>
</tr>
<tr class="festi-cart-item ">
<td class="festi-cart-product-img"> IMAGE 4
</td>
<td class="festi-cart-product-title">
<a class="festi-cart-title" href="">product name</a><br>
<span class="festi-cart-product-price">
<span class="woocommerce-Price-amount amount">p4</span>
</span>
</td>
</tr>
</tbody>
</table>
</div>感谢您的解释和故障排除。结束了使用另一个答案，但感谢输入！ –
错字，在'tr'类是'festi - 车 - item'，不'festi推车。商品' –
'$（'。festi-cart-product-price：not（：has（.woocommerce-Price-amount））'）。close（'。festi-cart-item'）。hide（）;' – Rayon