Maison  >  Article  >  interface Web  >  jquery supprime un dom

jquery supprime un dom

PHPz
PHPzoriginal
2023-05-25 11:11:071902parcourir

jQuery est l'une des bibliothèques JavaScript les plus populaires et son site officiel est http://jquery.com. Il peut facilement manipuler le HTML DOM, ce qui permet aux développeurs d'économiser beaucoup de temps et d'énergie. Une opération courante consiste à supprimer un élément DOM. Cet article va vous montrer comment supprimer un élément DOM à l'aide de jQuery.

1. Utilisez la méthode Remove()

jQuery fournit la méthode Remove(), qui peut supprimer directement les éléments sélectionnés du DOM. Par exemple, le code suivant peut supprimer tous les éléments de classe « test » du DOM :

$(".test").remove();

Le $ ici est une fonction utilisée pour interroger les éléments qui remplissent les conditions. $(".test") signifie sélectionner tous les éléments avec la classe "test". Après avoir appelé la méthode remove(), ces éléments seront supprimés du DOM.

2. Utilisez la méthode detach()

remove() peut supprimer des éléments du DOM, mais elle ne sauvegardera pas les données et les gestionnaires d'événements des éléments supprimés. Si vous devez réinsérer un élément supprimé, vous souhaiterez peut-être utiliser la méthode detach().

Semblable à la méthode Remove(), la méthode detach() peut également choisir de supprimer des éléments spécifiés, par exemple :

var detachedElement = $(".test").detach();

Dans cet exemple, sélectionnez tous les éléments avec la classe "test" et enregistrez-les dans la variable DemocratElement, et supprimez-les du DOM.

Ensuite, vous pouvez réinsérer l'élément comme ceci :

$("body").append(detachedElement);

Dans cet exemple, sélectionnez l'élément body et insérez-y l'élément détachéElement.

Cet exemple montre comment utiliser la méthode detach() pour supprimer des éléments et les conserver pour les opérations ultérieures.

3. Utilisez la méthode empty()

Si vous ne souhaitez pas supprimer l'intégralité de l'élément, mais que vous devez effacer le contenu de l'élément, vous pouvez utiliser la méthode empty().

$(".test").empty();

Dans cet exemple, le contenu de tous les éléments avec la classe "test" sera effacé. L'élément lui-même restera dans le DOM.

4. Utilisez la méthode unwrap()

Si vous souhaitez supprimer un élément et ses éléments contenus en même temps, vous pouvez utiliser la méthode unwrap().

$(".test").unwrap()

Dans cet exemple, tous les éléments de classe "test" seront supprimés, et les éléments contenus par ces éléments seront également supprimés du DOM. Semblable à la méthode Remove(), elle n'enregistre pas les données et les gestionnaires d'événements de l'élément supprimé.

Résumé

Ce qui précède présente quatre méthodes pour supprimer des éléments DOM dans jQuery. La méthode remove() peut supprimer directement l'élément sélectionné, ce qui est très utile lors de la suppression d'éléments ; la méthode detach() peut supprimer des éléments et enregistrer leurs données et gestionnaires d'événements pour les opérations ultérieures ; la méthode empty() peut effacer le contenu de l'élément sélectionné ; element Sans supprimer l'élément lui-même ; la méthode unwrap() supprime l'élément et ses éléments contenus. Choisir différentes méthodes en fonction de besoins spécifiques peut rendre votre code plus concis et efficace.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn