cycling jQuery_Succinctly | Page 41

alert($('li:nth-child(odd)').text()); // Alerts "135135". alert($('li:nth-child(even)').text()); // Alerts "2424". alert($('li:nth-child(2n)').text()); // Alerts "2424". })(jQuery); If you are surprised by the fact that $('li:nth-child(odd)').text() returns the value 135135, you are not yet grokking relationship filters. The statement, $('li:nth-child(odd)') said verbally would be “find all

elements in the Web page that are children, and then filter them by odd children.” Well, it just so happens that there are two structures in the page that have a grouping of siblings made up of

s. My point is this: The wrapper set is made up of elements based on a filter that takes into account an element's relationship to other elements in the DOM. These relationships can be found in multiple locations. The concept to take away is that not all filters are created equally. Make sure you understand which ones filter based on DOM relationships—e.g. :only-child—and which ones filter by the elements’ position—e.g. :eq()—in the wrapped set. Selecting elements by id when the value contains meta-characters jQuery selectors use a set of meta-characters (e.g. # ~ [] = > ) that when used as a literal part of a name (e.g. id="#foo[bar]") should be escaped. It is possible to escape characters by placing two backslashes before the character. Examine the code below to see how using two backslashes in the selection expression allows us to select an element with an id attribute value of #foo[bar]. Sample: sample29.html

jQuery

41