Differences between the Jqueryempty () remove () detach () method

Introduction: these methods have been used in recent projects, and they are similar to each other. I checked Jquery APIs and found many blog articles. I still cannot understand the differences. Finally, I found the difference between a lot of materials and my own case verification, and did not dare to share it exclusively. Method... SyntaxHighlighter. all ();

Introduction:
These methods have been used in recent projects, and I feel a lot similar. I checked Jquery APIs and found many blog articles, but I still cannot understand the differences. Finally, I found the difference between a lot of materials and my own case verification, and did not dare to share it exclusively.

 

Method Introduction:

Empty ()
This method removes not only child (and other descendant) elements, but also any text within the set of matched elements. this is because, according to the DOM specification, any string of text within an element is considered a child node of that element.
This method not only deletes its subnodes, but also deletes the text fields of the node (according to DOM specifications, the text fields of the node are also considered as subnodes ).

 

Remove ([selector])
SelectorA selector expression that filters the set of matched elements to be removed.

Similar. empty (),. remove () method takes elements out of the DOM. use. remove () when you want to remove the element itself, as well as everything inside it. in addition to the elements themselves, all bound events and jQuery data associated with the elements are removed. to remove the elements without removing data and events, use. detach () instead.
Similar to the empty method, the remove method also deletes elements from the DOM. When you want to delete the node itself and everything in the node, you can use the remove Method. In addition to the node itself, events bound to the node and JQuery data related to the node are also cleared. When you need to clear the node itself, but do not need to clear the bound events and data, you can use the detach method.

Detach ([selector])
SelectorA selector expression that filters the set of matched elements to be removed.

The. detach () method is the same. remove (), doesn t that. detach () keeps all jQuery data associated with the removed elements. this method is useful when removed elements are to be reinserted into the DOM at a later time.
The detach method is similar to the remove method, but it retains all JQuery-related data and bound events. This method will be useful when you want to add a new one after deletion.
 

 

Three differences:
Differences between empty, remove, and detach Methods

Method Name

Element itself (including all attributes)

Bind events and JQuery-related data

Text fields and subnodes

Empty ()
Do not delete

Do not delete

Delete

Remove ()
Delete

Delete

Delete

Detach ()
Delete

Do not delete

Delete

 

 

Example Verification:
Verification Environment: JQuery-1.8.0.min.js, Firefox 11.0, Firebug1.9.2;

1. Verify whether to delete the element book (including all attributes), text fields, and subnodes.
The Code is as follows:

[Html]
  
 
 
 
Test Jquery remove detach empty