2010-11-19 14 views
40

Ich habe ein Formular mit mehreren Spannen mit ID = "MyID". Ich möchte in der Lage sein, alle Elemente mit dieser ID aus dem DOM zu entfernen, und ich denke, dass jQuery der beste Weg ist, es zu tun. Ich habe herausgefunden, wie den $ .remove() -Methode verwendet eine Instanz dieser ID zu entfernen, indem man einfach tun:Mit jquery alle Elemente mit einer bestimmten ID löschen

$('#myid').remove() 

aber das ist natürlich nur die erste Instanz von myid entfernt. Wie wiederhole ich ALLE Instanzen von myid und entferne sie alle? Ich dachte, dass die jquery $ .each() -Methode der Weg sein könnte, aber ich kann die Syntax nicht herausfinden, um über alle Instanzen von myid zu iterieren und sie alle zu entfernen.

Wenn es eine saubere Möglichkeit gibt, dies mit regulärem JS (ohne jQuery) zu tun, bin ich auch dafür offen. Vielleicht besteht das Problem darin, dass IDs eindeutig sein sollen (d. H., Sie sollten nicht mehrere Elemente mit id = "myid" haben)?

Danke,

Chris

+0

Probieren Sie das Snippet ich unten veröffentlicht, sollte es funktionieren. – ace

+0

"Alle Elemente mit einer bestimmten ID" schmerzt in meinem Gehirn. IDs sollten überall eindeutig sein. – domih

Antwort

52

.remove() sollten alle von ihnen entfernen. Ich denke, das Problem ist, dass Sie eine ID verwenden. Es sollte nur ein HTML-Element mit einer bestimmten ID auf der Seite sein, so dass jQuery optimiert und nicht für sie alle suchen. Verwenden Sie stattdessen eine Klasse.

+0

Noch einmal, vielen Dank Jungs! – Chris

35

Alle Ihre Elemente, die eine eindeutige IDs haben sollte, so sollte es nicht mehr als ein Element sein mit #myid

Ein "id" ist eine eindeutige Kennung. Jedes Mal, wenn dieses Attribut in einem Dokument verwendet wird, muss es einen anderen Wert haben. Wenn Sie dieses Attribut als Hook für Stylesheets verwenden, ist es möglicherweise sinnvoller, Klassen (die Gruppenelemente) als die ID (die zum Identifizieren genau eines Elements verwendet werden) zu verwenden.

Neverthless, versuchen Sie dies:

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

Dies ist die perfekte Antwort. –

12

id of dom element shout muss eindeutig sein. Verwenden Sie stattdessen die Klasse (<span class='myclass'>). Um alle Spanne mit dieser Klasse zu entfernen:

$('.myclass').remove() 
0

Wie schon gesagt, nur ein Element eine spezifische ID hat. Verwenden Sie stattdessen Klassen. Hier ist jQuery-freie Version, um die Knoten zu entfernen:

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, die verwendet hier. getElementsByClassName wäre viel besser, wird aber nicht vom Internet Explorer < = IE 8 unterstützt.

Working Demo

7

wenn Sie alle Elemente mit passendem ID Teilen zu entfernen, zum Beispiel:

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

try this:

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

vergessen Sie nicht den '*' - dies wird sie alle auf einmal entfernen - Prost

Working Demo

5

Sie sollten einen class für mehrere Elemente verwenden, da ein id nur ein einzelnes Element sein soll. Um jedoch Ihre Frage auf der .each() Syntax zu beantworten, ist es das, was es aussehen würde:

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

Offizielle JQuery Dokumentation here.

5

Der sauberste Weg, es zu tun ist mit HTML5-Selektoren api, speziell querySelectorAll().

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

querySelectorAll() Die Funktion gibt ein Array von dom Elemente eine bestimmte ID übereinstimmen. Sobald Sie das zurückgegebene Array einem var zugewiesen haben, können Sie es als Argument an jquery übergeben remove().