Utilizzo di jquery per eliminare tutti gli elementi con un determinato ID

Question

Ho un modulo con diversi span con id = "myid". Mi piacerebbe essere in grado di rimuovere tutti gli elementi con questo ID dal DOM, e penso che jQuery sia il modo migliore per farlo. Ho capito come utilizzare il metodo $ .Rimuovere() per rimuovere un'istanza di questo ID, semplicemente facendo:

$('#myid').remove() 

ma, naturalmente, che rimuove solo la prima istanza di myid. Come faccio a scorrere tutte le istanze di myid e rimuoverle tutte? Ho pensato che il metodo $ .each() di jquery potesse essere il modo, ma non riesco a capire la sintassi per iterare su tutte le istanze di myid e rimuoverle tutte.

Se c'è un modo pulito per farlo con JS regolare (non usando jQuery) sono aperto anche a questo. Forse il problema è che gli ID dovrebbero essere unici (cioè non si suppone di avere più elementi con id = "myid")?

Grazie,

Chris

Answer 1

.remove() dovrebbe rimuovere tutti loro. Penso che il problema sia che stai usando un ID. Ci dovrebbe essere solo un elemento HTML con un particolare ID sulla pagina, quindi jQuery sta ottimizzando e non li sta cercando tutti. Utilizzare invece una classe .

Answer 2

Tutti gli elementi devono avere un ID univoci, quindi non ci dovrebbero essere più di un elemento con #myid

Un "id" è un identificativo univoco. Ogni volta che questo attributo viene utilizzato in un documento deve avere un valore diverso. Se si utilizza questo attributo come un hook per i fogli di stile, potrebbe essere più appropriato utilizzare le classi (quali elementi di gruppo) rispetto a id (utilizzate per identificare esattamente un elemento).

Neverthless, provate questo:

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

Answer 3

id di elemento dom shout essere unico. Utilizzare invece la classe (<span class='myclass'>). Per rimuovere tutto campata con questa classe:

$('.myclass').remove() 

Answer 4

come già detto, solo un elemento può avere uno specifico ID. Utilizzare invece le classi. Ecco la versione jQuery-libera per rimuovere i nodi:

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 che può essere utilizzato qui. getElementsByClassName sarebbe molto meglio, ma non è supportato da Internet Explorer < = IE 8.

Working Demo

Answer 5

se si desidera rimuovere tutti gli elementi con corrispondenti parti d'identità, ad esempio:

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

provare questo:

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

non dimenticare il '*' - questo li rimuoverà tutti in una volta - applausi

Working Demo

Answer 6

Si dovrebbe utilizzare uno class per più elementi come id è pensato per essere solo un singolo elemento. Per rispondere alla tua domanda sulla sintassi .each() però, questo è quello che sarebbe simile:

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

Ufficiale JQuery documentazione here.

Answer 7

Il modo più semplice per farlo è utilizzare i selettori html5 api, in particolare querySelectorAll().

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

La funzione querySelectorAll() restituisce un array di elementi DOM corrispondenza a uno specifico id. Dopo aver assegnato l'array restituito a var, è possibile passarlo come argomento a jquery remove().