Maison > Article > interface Web > Comment supprimer un élément avec jquery
Comment supprimer un élément avec jquery : 1. Utilisez la fonction empty() avec la syntaxe "spécifiez l'élément object.empty()" ; 2. Utilisez la fonction remove() avec la syntaxe "spécifiez l'élément object.remove" ; ()"; 3. , utilisez la fonction detach(), la syntaxe est "spécifiez l'élément object.detach()".
L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.2, ordinateur Dell G3.
1. Méthode empty()
Supprime tous les nœuds enfants des éléments correspondants dans la collection du DOM.
Exemple :
<div class="container"> <div class="hello">Hello</div> <div class="goodbye">Goodbye</div> </div>
Méthode de suppression :
$('.hello').empty();
Effet :
<div class="container"> <div class="hello"></div> <div class="goodbye">Goodbye</div> </div>
Si
contient un certain nombre d'éléments imbriqués, ils seront également supprimés.
Afin d'éviter les fuites de mémoire, jQuery supprime d'abord les fonctions de gestion des données et des événements des éléments enfants, puis supprime les éléments enfants
2. Méthode remove() :
Description : Supprimer l'ensemble des correspondances éléments du DOM. (Supprime également les événements et les données jQuery sur l'élément.)
Similaire à .empty(). .remove() déplace l'élément hors du DOM. Lorsque nous voulons supprimer l'élément lui-même, nous utilisons .remove(), qui supprimera également tout ce qui se trouve à l'intérieur de l'élément, y compris les événements liés et les données jQuery liées à l'élément
Exemple :
<div class="container"> <div class="hello">Hello</div> <div class="goodbye">Goodbye</div> </div>
Méthode Remove :
$('.hello').remove(); 或者用 $('div').remove('.hello');
Effet :
<div class="container"> <div class="goodbye">Goodbye</div> </div>
C'est-à-dire que le p correspondant à la classe est également supprimé
3. Méthode detach() :
Supprimer tous les éléments correspondants du DOM
La méthode detach() est la même comme .remove(), sauf que .detach() enregistre toutes les données jQuery associées à l'élément supprimé. Cette méthode est utile lorsqu'un élément doit être supprimé puis inséré dans le DOM.
4. Méthode html("") : La méthode
html() renvoie le contenu actuel de l'élément sélectionné si aucun paramètre n'est défini. html("")
efface le contenu actuel de l'élément sélectionné. La méthode
empty() supprime tout le contenu de l'élément sélectionné, y compris tout le texte et les nœuds enfants.
L'effet final des deux est le même
Valeur de retour html() : String, ce qui signifie qu'elle peut être reçue à l'aide de variables
Valeur de retour vide() : jQuery ne peut pas être reçu à l'aide de variables
De plus : la méthode
empty() n'a aucun paramètre et le sous-ensemble et le texte effacés ne peuvent pas être restaurés. Les méthodes detach() et remove() peuvent l'enregistrer dans une variable
Par exemple, déclarez la variable p et écrivez-la sous la forme suivante
var p=$('p').remove();
Lorsque vous devez l'ajouter à partir de zéro, vous pouvez l'ajouter directement comme suit
p.appendTo("body");
Il s'agit des méthodes detach() et remove(). Toutes ont des fonctions. La différence entre Remove() et detach() est que Remove() peut supprimer des classes spécifiées telles que Remove('a'), mais detach() ne peut pas le faire.
Notez également que Lorsque vous utilisez la méthode remove() pour supprimer un élément puis l'ajouter, les événements du sous-ensemble n'existeront pas, mais les événements du sous-ensemble detach() peuvent toujours être exécutés.
【Apprentissage recommandé : Tutoriel vidéo jQuery, Vidéo de développement web front-end】
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!