Programming Microsoft ASP.NET 4 - Dino Esposito [475]
// All P immediately preceded by A
$("a + p")
The ~ operator—the next operator—is similar to + except that it selects sibling elements just preceded by others. Here’s an example:
// All P preceded by A
$("a ~ p")
By using the comma, instead, you return the union of elements queried by multiple selectors. In terms of operations, the comma represents a logical OR of selectors. The next example, in fact, picks up elements that are either A or P:
// All A and all P
$("a, p")
Beyond simple operators, you have filters. A filter is a jQuery-specific expression that contains some custom logic to further restrict the selected elements.
Predefined Filters
Selectors can be further refined by applying filters on position, content, attributes, and visibility. A filter is a sort of built-in function applied to the wrapped set returned by a basic selector. Table 21-1 lists positional filters in jQuery.
Table 21-1. Positional Filters
Filter
Description
:first
Returns the first DOM element that matches
:last
Returns the last DOM element that matches
:not(selector)
Returns all DOM elements that do not match the specified selector
:even
Returns all DOM elements that occupy an even position in a 0-based indexing
:odd
Returns all DOM elements that occupy an odd position in a 0-based indexing
:eq(index)
Returns the DOM element in the wrapped set that occupies the specified 0-based position
:gt(index)
Returns all DOM elements that occupy a position in a 0-based indexing greater than the specified index
:lt(index)
Returns all DOM elements that occupy a position in a 0-based indexing less than the specified index
:header()
Returns all DOM elements that are headers, such as H1, H2, and the like
:animated()
Returns all DOM elements that are currently being animated via some functions in the jQuery library
Table 21-2 lists all filters through which you can select elements that are child elements of a parent element.
Table 21-2. Child Filters
Filter
Description
:nth-child(expression)
Returns all child elements of any parent that match the given expression. The expression can be an index or a math sequence (for example, 3n+1), including standard sequences such as odd and even.
:first:child
Returns all elements that are the first child of their parent.
:last-child
Returns all elements that are the last child of their parent.
:only-child
Returns all elements that are the only child of their parent.
A particularly powerful filter is nth-child. It supports a number of input expressions, as shown here:
:nth-child(index)
:nth-child(even)
:nth-child(odd)
:nth-child(expression)
The first format selects the n.th child of all HTML elements in the source selector. All child elements placed at any odd or even position in a 0-based indexing are returned if you specify the odd or even filter instead.
Finally, you can pass the nth-child filter a mathematical sequence expression, such as 3n to indicate all elements in a position that are a multiple of 3. The following selector picks up all rows in a table (labeled Table1) that are at the positions determined by the sequence 3n+1—that is, 1, 4, 7, and so forth:
#Table1 tr:nth-child(3n+1)
Table 21-3 lists expressions used to filter elements by content.
Table 21-3. Content Filters
Filter
Description
:contains(text)
Returns all elements that contain the specified text
:empty
Returns all elements with no children
:has(selector)
Returns all elements that contain at least one element that matches the given selector
:parent
Returns all elements that have at least one child
As far as content filters are concerned, you should note that any text in an HTML element is considered a child node. So elements selected by the empty filter have no child nodes and no text as well. An example is the
tag.
A popular and powerful category of filters are attribute filters. Attribute