jquery's event delegate and this, $ (this)

First of all, what is the event delegate, generally we set the event listener on the node that needs to trigger the event. Assuming a nav node has dozens of hundred Li tags, even using loop binding is quite a memory-intensive process that slows down the page. To solve this problem, you can use event delegates to delegate events to their common parent element node, UL, and event bubbling to pass events to the parent node of the click Node on UL, triggering the event.

//NAV labels that need to bind events<nav>            <ahref= "jq_load.html">HOME</a>            <ahref= "jq_load2.html">ROUTE</a>            <ahref= "jq_load3.html">TOYS</a>            <ahref= "Index.html">Timetable</a></nav>

// jquery file $ (function() {    $ (' Nav '). On (' click ',function(e) {        Console.log (E.target.innertext);     // HOME, the DOM element        where the Click event occurred Console.log (this);   // <nav>...</nav> The object        that binds the event Console.log ($ (this//JQuery.fn.init [nav, Context:nav],nav object     }) ;

Each event handler gets an event object that contains the methods and properties associated with this event. The last argument to the on method is a function that executes the function when the event is triggered, and the function automatically passes in the event object as its argument.

Writing this is because the code today, the E.target and this, $ (this) confused

E.target gets the object that is currently triggered, not the object that binds the event. And you cannot use the jquery method

This defaults to the Window object in the global context, where the object is pointed to, the constructor points to the instance object, and here it points to the nav element object of the bound event, and the jquery method cannot be used

$ (this) can create a jquery object containing the current element, which I understand as the encapsulation of this (the horizontal limit), and the same as this point to the Nav element object, you can use the jquery method.

jquery's event delegate and this, $ (this)