Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()-js-Tutorial-php.cn

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

青灯夜游

Freigeben： 2019-03-01 10:51:50

Original

3251 Leute haben es durchsucht

Es gibt drei Möglichkeiten, Elemente und Inhalte in jQuery zu löschen: die Methode „remove()“, die Methode „detach()“ und die Methode „empty()“. Im folgenden Artikel erfahren Sie, wie diese drei Methoden Elemente löschen und welche Unterschiede zwischen der Methode „remove()“, der Methode „detach()“ und der Methode „empty()“ bestehen. [Video-Tutorial-Empfehlung: jQuery-Tutorial]

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

jQuery-Remove()-Methode

remove ()-Methode wird verwendet, um das ausgewählte Element einschließlich aller darin enthaltenen Text- und untergeordneten Knotenelemente zu löschen.

Im Folgenden finden Sie ein Codebeispiel, um zu erfahren, wie die Methode „remove()“ Elemente löscht.

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<title>jQuery remove()方法</title>
<style>
#demo{
padding: 10px;
border: 1px solid red;
}
</style>
</head>
<body>
<h1 style="color:red;">PHP中文网</h1>
<div id="demo">
  <h2>使用remove()方法删除！</h2>
  <p>测试文本！</p>
</div>
<br>
<button>删除</button>
<script src="js/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("#demo").remove();
});
});
</script>
</body>
</html>

Nach dem Login kopieren

Ausgabe:

Vor dem Klicken auf die Schaltfläche „Löschen“:

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

Nach dem Klicken auf die Schaltfläche „Löschen“:

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

jQuery detach()-Methode

Die detach()-Methode wird verwendet, um das ausgewählte Element zu löschen, einschließlich aller Text- und untergeordneten Knotenelemente darin.

<script src="js/jquery.min.js"></script>
<script>
	$(document).ready(function() {
		$("button").click(function() {
			$("#demo").detach();
		});
	});
</script>

Nach dem Login kopieren

Ausgabe:

Vor dem Klicken auf die Schaltfläche „Löschen“:

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

Nach dem Klicken auf die Schaltfläche „Löschen“:

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

Erklärung:

Die Methoden „remove()“ und „detach()“ löschen beide das ausgewählte Element und seinen gesamten Inhalt, aber „remove(“ )-Methode behält nur das Element selbst bei, nicht jedoch die jQuery-Daten des Elements. Beispielsweise werden gebundene Ereignisse und Daten entfernt.

Die detach()-Methode behält jedoch nicht nur das Element selbst bei, sondern auch alle gebundenen Ereignisse, zusätzlichen Daten usw.

jQuery empty()-Methode

empty()-Methode wird verwendet, um den gesamten im ausgewählten Element enthaltenen Inhalt zu entfernen, einschließlich des gesamten Textes und des untergeordneten Elements Elemente.

Im Folgenden finden Sie ein Codebeispiel, um zu erfahren, wie die Methode empty() Elemente löscht.

<script src="js/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("#demo").empty();
});
});
</script>

Nach dem Login kopieren

Ausgabe:

Vor dem Klicken auf die Schaltfläche „Löschen“:

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

Nach dem Klicken auf die Schaltfläche „Löschen“:

Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()

Hinweis: Die Methode

empty() löscht nur den gesamten Inhalt innerhalb des ausgewählten Elements, das ausgewählte Element selbst wird jedoch nicht gelöscht.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere spannende Inhalte finden Sie in den entsprechenden Tutorial-Kolumnen auf der chinesischen PHP-Website! ! !

Das obige ist der detaillierte Inhalt vonWie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty(). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!