HTML and CSS Reference
In order to join these two criteria, a single selection criterion can be written as follows:
Notice that there is no space between one criteria and the next - if a space was placed here
this would mean something different, as we will see below.
We can use the same approach to match on both element type and class :
This will return all elements of type “input” that have a class of “large”.
It should never be necessary to combine selectors based on ID with other types of selector,
since IDs are unique within a document.
In addition to combining selectors for criterion relating to a single element, it is often ne-
cessary to select all elements that match selection criteria within a particular sub-tree of the
Consider a case where we have multiple tables in the same document, but we want to return
the first row in a specific table (for instance, the table with the ID tblTasks ). In order to
achieve this we first need to find the table called tblTasks , and then find the first row with-
in its sub-tree.
jQuery supports several ways of doing this. The most common approach is as follows:
> $('#tblTasks tr:first')
The space denotes the fact that these are two different selections. jQuery performs this be
selecting the elements that match the first selection:
and then executing the second selection against the sub-trees of these elements:
In fact, jQuery supports an alternative mechanism for doing this more explicitly:
Yet another approach to performing this same selection is to use the optional second para-
meter to the jQuery selector:
> $('tr:first', '#tblTasks')
The second parameter is used to specify the root of the sub-tree that the selection should
occur within. This can be a useful approach when you know you are dealing with a sub-
tree of the document, since you can assign the context to a variable, and then use that in all