DOM Traversal Methods - MarkMail

Selector Expressions
Multiple Elements: E,F,G
Selects all elements matched by selector expressions E, F, or G.
Examples
1. $('code, em, strong'): selects all elements matched by or or
2. $('p strong, .myclass'): selects all elements matched by that
are descendants of an element matched by as well as all elements that
have a class of myclass
Description
This comma (,) combinator is an efficient way to select disparate elements. An
alternative to this combinator is the .add() method described in Chapter 3.
Nth Child (:nth-child(n))
All elements that are the n th child of their parent.
Examples
1. $('li:nth-child(2)'): selects all elements matched by that are the
second child of their parent
2. $('p:nth-child(5)'): selects all elements matched by that are the fifth
child of their parent
Description
Because jQuery's implementation of :nth-child(n) is strictly derived from the CSS
specification, the value of n is 1-based, meaning that the counting starts at 1. For all
other selector expressions, however, jQuery follows JavaScript's "0-based" counting.
Therefore, given a single containing two s, $('li:nth-child(1)') selects
the first while $('li:nth(1)') selects the second.
Because the two look so similar, the :nth-child(n) pseudo-class is easily confused
with :nth(n), even though, as we have just seen, the two can result in dramatically
different matched elements. With :nth-child(n), all children are counted,
regardless of what they are, and the specified element is selected only if it matches
the selector attached to the pseudo-class. With :nth(n) only the selector attached
to the pseudo-class is counted, not limited to children of any other element, and the
nth one is selected. To demonstrate this distinction, let's examine the results of a few
selector expressions given the following HTML:
[ 22 ]