Méthode JQuery pour supprimer le DOM nodes_jquery

L'exemple de cet article décrit comment supprimer des nœuds DOM avec JQuery. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Si un élément est redondant dans le document, il doit être supprimé. JQuery propose deux méthodes pour supprimer des nœuds, à savoir Remove() et Empty().

La structure HTML DOM est la suivante :

<p class="nm_p" title="欢迎访问脚本之家" >欢迎访问脚本之家</p>
<ul class="nm_ul">
  <li title='PHP编程'>简单易懂的PHP编程</li>
  <li title='C编程'>简单易懂的C编程</li>
  <li title='JavaScript编程'>简单易懂的JavaScript编程</li>
  <li title='JQuery'>简单易懂的JQuery编程</li>
</ul>

Méthode Remove()

est utilisé pour supprimer tous les éléments correspondants du DOM, et les paramètres transmis sont utilisés pour filtrer les éléments en fonction des expressions JQuery.

Par exemple, pour supprimer le deuxième nœud d'élément 25edfb22a4f469ecb59f1190150159c6 dans le nœud ff6d136ddc5fdfeffaf53ff6ee95f185, le code JQuery est le suivant :

$(".nm_ul li:eq(1)").remove();
// 获取第二个<li>元素节点后，将它从网页中删除

Après avoir exécuté le code, le deuxième nœud sera supprimé.

Lorsqu'un nœud est supprimé à l'aide de la méthode remove(), tous les nœuds descendants contenus dans le nœud seront supprimés en même temps. La valeur de retour de cette méthode est une référence au nœud supprimé, afin que les éléments puissent être réutilisés ultérieurement. Le code JQuery suivant montre qu'une fois l'élément supprimé à l'aide de la méthode remove(), il peut toujours être utilisé.

var $li = $("nm_ul li:eq(1)").remove();
// 获取第二个<li>元素节点后，将它从网页中删除。 
$li.appendTo("nm_ul");
// 把刚才删除的又重新添加到<ul>元素里 
//所以，删除只是从网页中删除，在jQuery对象中，这个元素还是存在的，我们可以重新获取它 

Vous pouvez utiliser directement la fonctionnalité de la méthode appendTo() pour simplifier le code ci-dessus. Le code JQuery est le suivant :

$("nm_ul li:eq(1)").appendTo("nm_ul"); 
//appendTo()方法也可以用来移动元素 
//移动元素时首先从文档上删除此元素，然后将该元素插入得到文档中的指定节点

De plus, la méthode remove() peut également supprimer sélectivement des éléments en passant des paramètres. Le code JQuery est le suivant :

// 把<li>元素中属性title不等于"菠萝"的<li>元素删除
$("nm_ul li").remove("li[title!=JQuery]"); 

Méthode empty()

À proprement parler, la méthode empty() ne supprime pas le nœud, mais efface le nœud. Elle peut effacer tous les nœuds descendants de l'élément. Le code JQuery est le suivant :

$("nm_ul li:eq(1)").empty();
// 找到第二个<li>元素节点后，清空此元素里的内容

Lorsque le code est exécuté, le contenu du deuxième élément 25edfb22a4f469ecb59f1190150159c6 est effacé, ne laissant que le symbole par défaut "."

J'espère que cet article sera utile à la programmation jQuery de chacun.