Comparison between empty and html ('') in jQuery

HTML ()

return value: String
Overview:
Gets the HTML content of the first matching element. This function is not available for XML documents. But can be used for XHTML documents.

Empty ()

return value: JQuery
Overview
Deletes all the child nodes in the matching collection of elements.

The HTML () method returns the current contents of the selected element if the parameter is not set.
HTML ("") clears the current contents of the selected element.
The empty () method removes all content from the selected element, including all text and child nodes.

Example

Empty: function ()  {        var elem,    
         i = 0;         for  ( ;  (elem = this[i])  !=  null; i++ )  {            //  remove element nodes and prevent memory leaks     
        if  ( elem.nodeType === 1 )  {                                  //Cycle clears data                  jquery.cleandata ( 
GetAll ( elem, false )  );             }              //  removal of child             while   ( elem.firstChild )  {           
     elem.removechild ( elem.firstChild );             }              // if this is a select, ensure that  it displays empty  (#12336)              // support: ie<9              if  ( elem.options && jquery.nodename ( elem,  "select"  )  )  {                elem.options.length = 0;             }       
  }         return this;     },

In the code, you first erase all the data, so what does data contain?

The GetAll method finds all descendant elements. The GetAll code for jquery is as follows:

var strundefined = typeof undefined;
Function getall ( context, tag )  {    var elems, elem,         i = 0,          found = typeof context.getElementsByTagName !== strundefined ?  Context.getelementsbytagname ( tag | |   "*"  ) &NBSP:             typeof  Context.queryselectorall !== strundefined ? context.queryselectorall ( tag | |
  "*"  ) &NBSP:             undefined;     if  ( !found )  {        for   ( found = [], elems = context.childnodes | |  context;  (Elem = elems[i])  != null; i++ )  {            if  (  !tag | |  jquery.nodename ( elem, tag )  )  {       
         found.push ( elem );             } else {                 jquery.merge ( found, 
GetAll ( elem, tag )  );             }         &NBSP}     }     return tag === undefined | |
 tag && jquery.nodename ( context, tag )  ?         jquery.merge ( [ context ], found )  :
        found; } getAll (Document.body,false);// htmlcollection array

A collection of getall to be fetched, cleandata

Removeevent the event, freeing the memory (the jquery-bound event is saved in data), and the code below will find the list of events we bind. Expando is the identity of each object in the page that does not repeat jquery.

expando: "JQuery" + (version + Math.random ()). Replace (/\d/g, ""),

$ (' body '). On (' click ', Function () {

alert (' This is body ');

Console.log ($.cache[$ (' body ') [0][$.expando]]);

Delete Internalkey (object ID), push ID to Deletedids

Simply empty, the first loop is to remove the bindings for descendant elements, clear jquery to this DOM cache, and then loop Removefirstchild.

and the HTML ('), is simply violent setting innerHTML = ';