jQueryは、___クラスの別の要素を含む要素を削除します

Question

数日間見てきましたが、この問題の解決策を見つけることができません。それはおそらく非常に明白ですが、何かのクラスで別の要素を含む要素を削除する方法はありますか？この場合、「tumblr_blog」というクラスのアンカーを含む要素<p>を削除したいとします。私は使用します：containsが、段落はデフォルトでクラスを持たないコロンを含み、段落要素はクラスを持たないので、tumblr_blogのクラスでアンカーを含む段落を削除する方法はありますか？このスクリプトでは、クラスがないのに、段落の：も削除する必要があります。誰かが私を助けることができれば、本当に私の夜を作るでしょう。ありがとう！

編集：ありがとう、アレックス！最後の1つは、最初のページで動作しますが、新しい要素が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); 
    } 
}); 

でそれを行うことができますので、それはInfinite Scrollプラグインで動作する、新しいコンテンツがあたりとしてロードされたときにコールバックにこのコードを追加ドキュメンテーション。

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（ "* [クラス〜=が '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); 
}