Supprimer un élément jQuery

Une partie très importante de jQuery est la manipulation du DOM.

jQuery fournit de nombreuses méthodes pour supprimer des éléments ou du contenu existants dans le document.

Dans ce chapitre, nous expliquerons comment supprimer des éléments HTML du DOM/Contenu.

Suppression d'éléments jQuery/Contenu

Avec jQuery, nous pouvons facilement supprimer des éléments HTML.

Nous avons les méthodes jQuery suivantes pour supprimer des éléments et du contenu :

• remove()

• empty()

• unwrap()

Je vais vous montrer comment utiliser chaque méthode.

Méthode jQuery remove()

jQuery remove()La méthode supprime l'élément sélectionné et ses descendants du DOM.

L'exemple suivant montre comment supprimer tous les paragraphes du DOM :

$("button").click(function(){
　　$("p").remove();
});

jQuery remove()La méthode accepte également un paramètre qui vous permet de filtrer les éléments à supprimer.

Ce paramètre peut être n'importe quel sélecteur jQuery.

L'exemple suivant montre comment supprimer tous les paragraphes contenant "Hello" du DOM :

$("button").click(function(){
　　$("p").remove(":contains('Hello')");
});

Méthode jQuery empty()

jQuery empty()La méthode supprime tous les descendants de l'élément sélectionné (y compris les nœuds de texte).

L'exemple suivant montre comment supprimer tous les descendants (y compris les nœuds de texte) de tous les paragraphes :

$("button").click(function(){
　　$("p").empty();
});

Attention :Cette méthode ne supprime pas l'élément lui-même ou ses attributs.

Méthode unwrap() jQuery

jQuery unwrap()La méthode supprime l'élément parent de l'élément sélectionné.

L'exemple suivant supprime tous les éléments parent de tous les paragraphes :

$("button").click(function(){
　　$("p").unwrap();
});

Suppression d'attributs jQuery-removeAttr()

jQuery removeAttr()La méthode supprime un ou plusieurs attributs de l'élément sélectionné.

L'exemple suivant supprime l'attribut href de tous les liens hypertextes :

$("button").click(function(){
　　$("a").removeAttr("href");
});

Pour supprimer plusieurs attributs, séparez les noms des attributs par des espaces.

L'exemple suivant supprime plusieurs attributs de tous les paragraphes :

$("button").click(function(){
　　$("p").removeAttr("id class title");
});

Référence jQuery HTML

Pour consulter les méthodes HTML complètes, veuillez visiter notrejQuery HTML / Référence CSS.