jqueryを使用して特定のIDを持つすべての要素を削除する

Question

id = "myid"の複数のスパンを持つフォームがあります。私はこのIDを持つすべての要素をDOMから取り除きたいと思っています.jQueryがこれを行う最良の方法だと思います。私は単純に実行することによって、このIDの1つのインスタンスを削除するには$ .remove（）メソッドを使用する方法を考え出し：

$('#myid').remove() 

だけMYIDの最初のインスタンスを削除もちろん

。どのようにしてmyidのすべてのインスタンスを反復処理し、それらをすべて削除するのですか？私はjquery $。each（）メソッドが方法かもしれないと思ったが、myidのすべてのインスタンスを反復してそれらをすべて削除する構文を理解することはできない。

通常のJS（jQueryを使用しない）でこれを行うためのきれいな方法がある場合、私はそれも公開しています。おそらく問題は、idが一意であると想定されているということです（つまり、id = "myid"の複数の要素を持つことにはなりません）。

おかげで、

クリス

Answer 1

.remove()：

Neverthless、これを試してみてください。問題はあなたがIDを使っていることだと思います。 ページ上に特定のIDを持つHTML要素しかないはずなので、jQueryは最適化していて、それらをすべて検索しません。代わりにクラスを使用してください。

Answer 2

あなたのすべての要素が固有のIDを持っている必要があり、そう#myid

アン「ID」で複数の要素があってはならない、一意の識別子です。この属性がドキュメントで使用されるたびに、別の値を持つ必要があります。この属性をスタイルシートのフックとして使用している場合は、id（正確に1つの要素を識別するために使用される）よりもクラス（グループ要素）を使用するほうが適切な場合があります。それらのすべてを削除する必要があり

$("span[id=myid]").remove(); 

Answer 3

dom要素のIDは一意である必要があります。代わりにクラスを使用してください（<span class='myclass'>）。

$('.myclass').remove() 

Answer 4

すでに述べたように、唯一要素は、特定のIDを持つことができます。このクラスで、すべてのスパンを削除するには 。代わりにクラスを使用してください。

var form = document.getElementById('your-form-id'); 
var spans = form.getElementsByTagName('span'); 

for(var i = spans.length; i--;) { 
    var span = spans[i]; 
    if(span.className.match(/\btheclass\b/)) { 
     span.parentNode.removeChild(span); 
    } 
} 

getElementsByTagNameis the most cross-browser-compatible methodここで使用することができます：ここでは、ノードを削除するjQueryのフリーバージョンです。 getElementsByClassNameははるかに優れていますが、Internet Explorer < = IE 8ではサポートされていません。

Working Demo

Answer 5

あなたが一致するIDの部品を持つすべての要素を削除する場合は、例えば：

<span id='myID_123'> 
<span id='myID_456'> 
<span id='myID_789'> 

はこれを試してみてください。

$("span[id*=myID]").remove(); 

は '*' を忘れないでください - これを一度にすべて削除します - 歓声

Working Demo

Answer 6

複数の要素にはclassを使用する必要があります。idは1つの要素のみを意味します。

$('#myID').each(function() { 
    $(this).remove(); 
}); 

公式jQueryのドキュメントhere：しかし.each()構文のあなたの質問に答えるために、これは、それがどのように見えるかです。

Answer 7

これを行う最もクリーンな方法は、html5セレクタapiを使用することです。具体的にはquerySelectorAll()です。

var contentToRemove = document.querySelectorAll("#myid"); 
$(contentToRemove).remove(); 

querySelectorAll()関数は、特定のIDと一致するDOM要素の配列を返します。返された配列をvarに割り当てたら、jquery remove()の引数として渡すことができます。