Utiliser jquery pour supprimer tous les éléments avec un identifiant donné

Question

J'ai un formulaire avec plusieurs travées avec id = "myid". J'aimerais pouvoir supprimer tous les éléments avec cet ID du DOM, et je pense que jQuery est la meilleure façon de le faire. Je me suis dit comment utiliser la méthode .remove $() pour supprimer une instance de cet identifiant, en faisant simplement:

$('#myid').remove() 

mais bien sûr, qui ne supprime que la première instance de myid. Comment puis-je itérer sur TOUTES les instances de myid et les supprimer toutes? Je pensais que la méthode jquery $ .each() pourrait être le moyen, mais je ne peux pas comprendre la syntaxe pour itérer sur toutes les instances de myid et les supprimer tous.

S'il existe un moyen propre de le faire avec JS standard (sans utiliser jQuery), je suis ouvert à cela aussi. Peut-être que le problème est que les ID sont supposés être uniques (c'est-à-dire que vous n'êtes pas censé avoir plusieurs éléments avec id = "myid")?

Merci,

Chris

Answer 1

.remove() devrait supprimer tous. Je pense que le problème est que vous utilisez un identifiant. Il est seulement supposé être un élément HTML avec un identifiant particulier sur la page, donc jQuery optimise et ne cherche pas tous. Utilisez plutôt une classe .

Answer 2

Tous vos éléments doivent avoir un ID unique, donc il ne devrait pas être plus d'un élément aveC#myid

Un "id" est un identifiant unique. Chaque fois que cet attribut est utilisé dans un document, il doit avoir une valeur différente. Si vous utilisez cet attribut comme crochet pour des feuilles de style, il peut être plus approprié d'utiliser des classes (qui groupent des éléments) que des id (qui sont utilisées pour identifier exactement un élément).

Neverthless, essayez ceci:

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

Answer 3

L'identifiant de l'élément dom est unique. Utilisez la classe à la place (<span class='myclass'>). Pour enlever toute la durée de cette classe:

$('.myclass').remove() 

Answer 4

Comme déjà dit, que un élément peut avoir un ID spécifique. Utilisez des classes à la place. Voici la version jQuery sans supprimer les nœuds:

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 qui peut être utilisé ici. getElementsByClassName serait beaucoup mieux, mais n'est pas supporté par Internet Explorer < = IE 8.

Working Demo

Answer 5

si vous voulez supprimer tous les éléments avec fini- ID, par exemple:

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

essayez ceci:

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

ne pas oublier le '*' - cela les enlèvera tous à la fois - acclamations

Working Demo

Answer 6

Vous devez utiliser un class pour plusieurs éléments car un id ne doit être qu'un seul élément. Pour répondre à votre question sur la syntaxe .each() bien, voici ce qu'elle ressemblerait à ceci:

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

documentation jquery officiel here.

Answer 7

La façon la plus simple de le faire est d'utiliser les sélecteurs html5 api, plus précisément querySelectorAll().

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

La fonction querySelectorAll() renvoie une matrice d'éléments DOM correspondant un identifiant spécifique. Une fois que vous avez affecté le tableau retourné à un var, vous pouvez le passer en argument à jquery remove().