jQuery in Action
30
CHAPTER 2
Creating the wrapped element set
In the first case, all
<p>
elements descending from a
<div>
element that aren't
hidden are selected. The second selector is illegal because it attempts to apply
:not
to a selector that isn't a filter (the
p
in
p:hidden
isn't a filter).
To make things simpler, filter selectors are easily identified because they all
begin with a colon character (
:
) or a square bracket character (
[
). Any other selec-
tor can't be used inside the
:not()
filter.
As we've seen, jQuery gives us a large toolset with which to select existing ele-
ments on a page for manipulation via the jQuery methods, which we'll examine
in chapter 3. But before we look at the manipulation methods, let's see how to use
the
in chapter 3. But before we look at the manipulation methods, let's see how to use
the
$()
function to create new
HTML
elements to include in matched sets.
"But wait!" as they say, "there's more!"
We've emphasized, and will continue to emphasize, that part of jQuery's strength is
the ease with which it allows extensions via plugins. If you're familiar with using
XML Path Language (XPath) to select elements within an Extensible Markup Lan-
guage (XML) document, you're in luck. A jQuery plugin provides some basic XPath
support that can be used together with jQuery's excellent CSS and custom selec-
tors. Look for this plugin at http://jquery.com/plugins/project/xpath.
the ease with which it allows extensions via plugins. If you're familiar with using
XML Path Language (XPath) to select elements within an Extensible Markup Lan-
guage (XML) document, you're in luck. A jQuery plugin provides some basic XPath
support that can be used together with jQuery's excellent CSS and custom selec-
tors. Look for this plugin at http://jquery.com/plugins/project/xpath.
Keep in mind that the support for XPath is basic, but it should be enough (in com-
bination with everything else we can do with jQuery) to make some powerful selec-
tions possible.
bination with everything else we can do with jQuery) to make some powerful selec-
tions possible.
First, the plugin supports the typical / and // selectors. For example, /html//
form/fieldset
form/fieldset
selects all <fieldset> elements that are directly under a <form>
element on the page.
We can also use the * selector to represent any element, as in/html//form/*/
input
input
, which selects all <input> elements directly under exactly one element
that's under a <form> element.
The XPath plugin also supports the parent selector .., which selects parents of
previous element selectors. For example: //div/.. matches all elements that are
directly parent to a <div> element.
previous element selectors. For example: //div/.. matches all elements that are
directly parent to a <div> element.
Also supported are XPath attribute selectors (//div[@foo=bar]), as well as con-
tainer selectors (//div[@p], which selects <div> elements containing at least one
<p>
tainer selectors (//div[@p], which selects <div> elements containing at least one
<p>
element). The plugin also supports position() via the jQuery position selec-
tors described earlier. For instance, position()=0 becomes :first, and posi-
tion()>n
tion()>n
becomes :gt(n).