Heim >Web-Frontend >js-Tutorial >Wie lösche ich Elemente mit jQuery? Einfacher Vergleich von Remove(), Detach() und Empty()
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]
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>
Ausgabe:
Vor dem Klicken auf die Schaltfläche „Löschen“:
Nach dem Klicken auf die Schaltfläche „Löschen“:
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>
Ausgabe:
Vor dem Klicken auf die Schaltfläche „Löschen“:
Nach dem Klicken auf die Schaltfläche „Löschen“:
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>
Ausgabe:
Vor dem Klicken auf die Schaltfläche „Löschen“:
Nach dem Klicken auf die Schaltfläche „Löschen“:
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!