JQuery-Methode zum Löschen von DOM nodes_jquery

Das Beispiel in diesem Artikel beschreibt, wie man DOM-Knoten mit JQuery löscht. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Wenn ein Element im Dokument überflüssig ist, sollte es gelöscht werden. JQuery bietet zwei Methoden zum Löschen von Knoten, nämlich Remove() und Empty().

HTML-DOM-Struktur ist wie folgt:

<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>

remove()-Methode

wird verwendet, um alle übereinstimmenden Elemente aus dem DOM zu entfernen, und die übergebenen Parameter werden verwendet, um Elemente basierend auf JQuery-Ausdrücken zu filtern.

Um beispielsweise den zweiten 25edfb22a4f469ecb59f1190150159c6-Elementknoten zu löschen, lautet der JQuery-Code wie folgt:

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

Nachdem der Code ausgeführt wurde, wird der zweite Knoten gelöscht.

Wenn ein Knoten mit der Methode „remove()“ gelöscht wird, werden alle im Knoten enthaltenen untergeordneten Knoten gleichzeitig gelöscht. Der Rückgabewert dieser Methode ist eine Referenz auf den gelöschten Knoten, sodass die Elemente später wieder verwendet werden können. Der folgende JQuery-Code zeigt, dass das Element nach dem Löschen mit der Methode „remove()“ weiterhin verwendet werden kann.

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

Sie können die Funktion der appendTo()-Methode direkt verwenden, um den obigen Code zu vereinfachen:

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

Darüber hinaus kann die Methode „remove()“ auch selektiv Elemente löschen, indem sie Parameter übergibt. Der JQuery-Code lautet wie folgt:

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

empty()-Methode

Genau genommen löscht die Methode empty() den Knoten nicht, sondern löscht den Knoten. Sie kann alle untergeordneten Knoten im Element löschen. Der JQuery-Code lautet wie folgt:

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

Wenn der Code ausgeführt wird, wird der Inhalt des zweiten 25edfb22a4f469ecb59f1190150159c6-Elements gelöscht, sodass nur das Standardsymbol „.“ übrig bleibt.

Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.