Asked By: Anonymous
I’ve always wondered… so you have a code like this:
and you attach it with this:
where is the ‘meta-data’ that says:
“Hey “jQuery-object #click-me,” I will point you to ‘someFunction’ when you are clicked!”
I know that event-handlers can get destroyed such as my situation with Backbone.js where my events stopped firing due to me re-rendering the entire page, destroying some background functions/objects/Views along the way.. (this is the context as to why I’m asking this question)
NOW, MY QUESTION IS:
where are events ‘meta-data’ stored and how are they destroyed?
Are they stored within the function that bound it to a function? Are they within the DOM ‘meta-data’ (if there is one) itself?
(also, as a side note, how can I access these events and ‘debug’ them? firefox? chrome?)
Answered By: Anonymous
jQuery stores all the event binding and data cache on the jQuery.cache object. All the DOM nodes which were wrapped with jQuery and had events bound to them or data set will get automatically cleared when you are using jQuery
That’s why it’s very important to never use
innerHTML or other native DOM methods to insert/replace content that was altered before by jQuery. It will lead to leaks that you won’t be able to cleanup unless you reset the jQuery.cache object manually.
There is also an undocumented method
jQuery.cleanData which takes a collection of DOM nodes as an argument and it iterates over them and cleans up all their event bindings, data and removes references to these elements from the cache. This one can be useful if you have DOM fragments which were detached from the main DOM tree and there is a risk that they won’t get cleaned up properly.