jQuery 删除包含另一个具有 ___ 类的元素的元素

Question

我已经找了好几天了，但找不到解决这个问题的方法。这可能非常明显，但是有没有办法删除包含具有某类的另一个元素的元素？在本例中，我想删除包含“tumblr_blog”类锚点的

元素。我会使用 :contains，但是段落默认包含一个没有类的冒号，并且段落元素没有类，那么有没有办法删除包含 tumblr_blog 类的锚点的段落？该脚本还应该删除段落中的 :，即使它没有类。如果有人能帮助我，那我的夜晚真的会很美好。谢谢！

编辑：谢谢亚历克斯！最后一件事，它在第一页上工作，但是当 Paul Irish 通过无限滚动功能加载新元素时，代码不再工作，因为加载新页面时没有刷新。这是我的代码，有没有办法在加载的新元素上实现代码？

<script>
$(function(){
var $container = $('#posts');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '#entry',
columnWidth: 370,
});
});
$container.infinitescroll({
navSelector : '#page-nav', // selector for the paged navigation 
nextSelector : '#page-nav a', // selector for the NEXT link (to page 2)
itemSelector : '#entry', // selector for all items you'll retrieve
loading: {
finishedMsg: '<em></em>',
}
},
// trigger Masonry as a callback
function( newElements ) {
// hide new items while they are loading
var $newElems = $( newElements ).css({ opacity: 0 });
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
// show elems now they're ready
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
}
);
});
</script>

Answer 1

...有没有办法删除包含 tumblr_blog 类锚点的段落？

您可以使用 :has() 选择器。

$('p:has(a.tumblr_blog)').remove();

jsFiddle。

为了获得更好的性能，请选择所有 p，然后使用 has() 方法。

如果你没有 jQuery，你可以使用...

var allP = document.querySelectorAll('p');

Array.forEach(allP, function(p) {
    if (p.querySelector('a.tumblr_blog').length) {
        p.parentNode.removeChild(p);
    }
});

所以它可以与 无限滚动插件，根据文档加载新内容时将此代码添加到回调中。

Answer 2

只需首先选择具有特定类的元素，然后删除其父元素。

<p>
 :
 <a class="tumblr_blog">...</a>
 ...
</p>

<script type="text/javascript">
$(document).ready(function() {
  $('p a.tumblr_blog').parent().remove();
});
</script>

Answer 3

或者您可以执行“普通”CSS 选择器，然后使用 .parent() 方法。

$("p a.tumblr_blog").parent().remove();

Answer 4

document.querySelectorAll("*[class~='className']") 将返回具有该类的所有节点的节点列表。然后循环遍历每个节点并使用 .parentNode 获取对其父节点的引用，然后您可以使用 ref.parentNode.removeChild(ref); 将其从其 .parentNode 中删除。把所有的放在一起：

var nodesWithClass = document.querySelectorAll("*[class~='className']");
for (var i=0;i<nodesWithClass.length;i++)
{
    nodesWithClass[i].parentNode.parentNode.removeChild(nodesWithClass[i].parentNode);
}