Comment détruire un élément DOM avec jQuery?


141

Supposons que l'objet jQuery soit $target.

Réponses:


194

Est $target.remove();ce que vous cherchez?

https://api.jquery.com/remove/


75
Bien sûr, cela ne fait que le supprimer du document visible. S'il existe d'autres références au nœud à partir de JavaScript, telles que la variable $ target elle-même, l'objet échappera pour le moment au ramasse-miettes. Si vous voulez le DÉTRUIRE, vous devez également perdre toutes les références. Je ne sais pas trop pourquoi vous voudriez DÉTRUIRE un élément DOM. Peut-être que vous détestez simplement $ target. Pauvre $ cible, qu'est-ce que cela vous a fait?
bobince

52
$ target est gentil quand il est seul, mais il devient méchant quand il est autour de ses 100 000 amis clonés.
Sebastián Grignoli

2
Aura .empty()- t -il un effet similaire?
Saurabh Nanda

3
@SaurabhNanda - Empty supprimera le contenu de l'objet, mais ne supprimera pas (ou ne détruira pas) l'objet lui-même.
Luc

46

Si vous souhaitez détruire complètement la cible, vous avez plusieurs options. Vous pouvez d'abord supprimer l'objet du DOM comme décrit ci-dessus ...

console.log($target);   // jQuery object
$target.remove();       // remove target from the DOM
console.log($target);   // $target still exists

Option 1 - Remplacez ensuite la cible par un objet jQuery vide (jQuery 1.4+)

$target = $();
console.log($target);   // empty jQuery object

Option 2 - Ou supprimez entièrement la propriété (provoquera une erreur si vous la référencez ailleurs)

delete $target;
console.log($target);   // error: $target is not defined

Plus de lecture: informations sur l'objet jQuery vide et informations sur la suppression


3
Pourquoi delete $targetne fonctionnera pas: perfectionkills.com/understanding-delete/#misconceptions Pourquoi ne $target=nullfonctionnera pas ?
LeeGee

@LeeGee - Pouvez-vous résumer votre message pour expliquer pourquoi la suppression ne fonctionnera pas pour les objets jQuery? Pourquoi cela semble-t-il fonctionner lorsque nous regardons console.log ($ target) à la fin? Je vous remercie.
Luc

Je ne peux pas l'expliquer mieux que l'article cité, que j'ai trouvé très détaillé.
LeeGee

Pour mémoire, cela fonctionne dans la console car la console évalue JS dans la portée de eval, ce qui permet la suppression. Les variables des étendues "naturelles" ne seront pas supprimables. Utilisez $target=nullplutôt. Il est plus rapide et ne gâche pas les optimisations internes du navigateur.
bendman

1
Supprimer, c'est bien. Cela signifie simplement que le bloc ne sera pas optimisé par le moteur JS. Dans la plupart des cas, cela n'a aucune importance. Quand cela devient un problème, vous recherchez des moyens d'utiliser la suppression. Pas avant.
Charlie Martin

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.