CSS Selectors
- * any element
- E an element of type E
- E:nth-child(n) an E element, the n-th child of its parent
- E:first-child an E element, first child of its parent
- E:last-child an E element, last child of its parent
- E:only-child an E element, only child of its parent
- E:empty an E element that has no children (including text nodes)
- E:enabled a user interface element E which is not disabled
- E:disabled a user interface element E which is disabled
- E:checked a user interface element E which is checked (for instance a radio-button or checkbox)
- E:selected a user interface element E which is selected (one or more option elements inside a select) - not in the CSS spec, but nonetheless supported by jQuery
- E.warning an E element whose class is "warning"
- E#myid an E element with ID equal to "myid". (Will only match, at most, one element.)
- E:not(s) an E element that does not match simple selector s
- E F an F element descendant of an E element
- E > F an F element child of an E element
- E + F an F element immediately preceded by an E element
- E ~ F an F element preceded by an E element
- E,F,G select all E elements, F elements, and G elements
- E[@foo] an E element with a "foo" attribute
- E[@foo=bar] an E element whose "foo" attribute value is exactly equal to "bar"
- E[@foo^=bar] an E element whose "foo" attribute value begins exactly with the string "bar"
- E[@foo$=bar] an E element whose "foo" attribute value ends exactly with the string "bar"
- E[@foo*=bar] an E element whose "foo" attribute value contains the substring "bar"
XPath Selectors
Location Paths
- Relative to the entire HTML document
$("/html/body//p")
$("body//p")
$("p/../div")
- Relative to the context node this
$("p/*", this)
$("/p//a", this)
[edit]
- Descendant Element has a descendant element
$("//div//p")
- Child Element has a child element
$("//div/p")
- Preceding Sibling Element has an element before it, on the same axes
$("//div ~ form")
- Parent Selects the parent element of the element
$("//div/../p")
[edit]
- [@foo] Has an attribute of foo
$("//input[@checked]")
- [@foo='test'] Attribute foo is equal to test
$("//a[@ref='nofollow']")
- [Nodelist] Element contains a node list, for example:
$("//div[p]")
$("//div[p/a]")
[edit]
Supported Predicates, but differently
- [last()] or [position()=last()] becomes :last
$("p:last")
- [0] or [position()=0] becomes :eq(0) or :first
$("p:first")
$("p:eq(0)")
- [position() < 5] becomes :lt(5)
$("p:lt(5)")
- [position() > 2] becomes :gt(2)
$("p:gt(2)")
Custom Selectors
- :even Selects every other (even) element from the matched element set.
- :odd Selects every other (odd) element from the matched element set.
- :eq(0) and :nth(0) Selects the Nth element from the matched element set
- :gt(N) Selects all matched elements whose index is greater than N.
- :lt(N) Selects all matched elements whose index is less than N.
- :first Equivalent to :eq(0)
- :last Selects the last matched element.
- :parent Selects all elements which have child elements (including text).
- :contains('test') Selects all elements which contain the specified text.
- :visible Selects all visible elements (this includes items that have a display of block or inline, a visibility of visible, and aren't form elements of type hidden)
- :hidden Selects all hidden elements (this includes items that have a display of none, or a visibility of hidden, or are form elements of type hidden)
Some examples:
$("p:first").css("fontWeight","bold");
$("div:hidden").show();
$("/div:contains('test')", this).hide();
Form Selectors
There are a few selectors for form elements:
- :input Selects all form elements (input, select, textarea, button).
- :text Selects all text fields (type="text").
- :password Selects all password fields (type="password").
- :radio Selects all radio fields (type="radio").
- :checkbox Selects all checkbox fields (type="checkbox").
- :submit Selects all submit buttons (type="submit").
- :image Selects all form images (type="image").
- :reset Selects all reset buttons (type="reset").
- :button Selects all other buttons (type="button").
- :file Selects all .
No comments:
Post a Comment