DOM traversal under the hood

In Chapter 2, Selecting Elements, and again at the beginning of this chapter, we looked at ways of traveling from one set of DOM elements to another by calling DOM traversal methods. Our (far from exhaustive) survey of such methods included simple ways to reach neighboring cells, such as .next() and .parent(), and more complex ways of combining selector expressions, such as .find() and .filter(). By now, we should have a fairly strong grasp to these approaches of getting from one DOM element to another step by step.

Each time we take one of these steps, though, jQuery takes note of our travels, laying down a trail of breadcrumbs we can follow back home if needed. A couple of the methods we briefly touched on in that chapter, .end() and .addBack(), take advantage of this record keeping. To be able to get the most out of these methods, and in general to write efficient jQuery code, we need to understand a bit more about how the DOM traversal methods do their jobs...