Overview of technical documentation

  1. ← introduction to deferred jQuery chain
  2. ← delays in the invocation chain
  3. ← deferred jQuery chains and animations
  4. ← method repetition with loops
  5. ← inline event handlers
  6. taking snapshots of jQuery chains
  7. → deferred jQuery chains and objects
  8. → Summary

Where is my chain right now?

jQuery provides the possibility to clone any jQuery selection object via:

var $some = $('#myID').parent().siblings();
var $new = $($some);

Now we have two jQuery objects with the same elements selected. The obvious difference between them is that they are now different JavaScript objects. Another difference is that $some.end() points to the parent of the element #myID while $new.end() doesn't.

Well, as expected you can do the same cloning with any deferred jQuery chain:

var $some = $('#myID').wait(500).siblings().remove();
var $new = $($some);

The big question is: What is the content of the jQuery object $new now?

To answer that question we need to know that $(deferredJQuery) just clones the jQuery selection of the invocation chain in this very moment. You can understand this like taking a snapshot. You then see which elements your chain is handling right now.

Now the answer: $new just points to the element #myID, because the siblings are selected half a second later.

But when we wait for a second and then call var $other = $($some) then the new jQuery selection object $other points to the removed siblings of #myID.

inline event handlers ← taking snapshots of jQuery chains → deferred jQuery chains and objects