jQuery Selectors
jquery selectors are the most important
aspects of the jquery Library. On top of standard CSS selectors jquery
introduces some custom selectors that makes your code even more simpler and
easier to read. Below is a summary table of the jquery selectors
Selector |
Example |
Selects |
* |
$("*") |
All elements |
#id |
$("#lastname") |
The element with id=lastname |
.class |
$(".intro") |
All elements with class="intro" |
element |
$("p") |
All p elements |
.class.class |
$(".intro.demo") |
All elements with the classes "intro" and "demo" |
|
|
|
:first |
$("p:first") |
The first p element |
:last |
$("p:last") |
The last p element |
:even |
$("tr:even") |
All even tr elements |
:odd |
$("tr:odd") |
All odd tr elements |
|
|
|
:eq(index) |
$("ul li:eq(3)") |
The fourth element in a list (index starts at 0) |
:gt(no) |
$("ul li:gt(3)") |
List elements with an index greater than 3 |
:lt(no) |
$("ul li:lt(3)") |
List elements with an index less than 3 |
:not(selector) |
$("input:not(:empty)") |
All input elements that are not empty |
|
|
|
:header |
$(":header") |
All header elements h1, h2 ... |
:animated |
$(":animated") |
All animated elements |
|
|
|
:contains(text) |
$(":contains('W3Schools')") |
All elements which contains the text |
:empty |
$(":empty") |
All elements with no child (elements) nodes |
:hidden |
$("p:hidden") |
All hidden p elements |
:visible |
$("table:visible") |
All visible tables |
|
|
|
s1,s2,s3 |
$("th,td,.intro") |
All elements with matching selectors |
|
|
|
[attribute] |
$("[href]") |
All elements with a href attribute |
[attribute=value] |
$("[href='default.htm']") |
All elements with a href attribute value equal to "default.htm" |
[attribute!=value] |
$("[href!='default.htm']") |
All elements with a href attribute value not equal to "default.htm" |
[attribute$=value] |
$("[href$='.jpg']") |
All elements with a href attribute value ending with ".jpg" |
|
|
|
:input |
$(":input") |
All input elements |
:text |
$(":text") |
All input elements with type="text" |
:password |
$(":password") |
All input elements with type="password" |
:radio |
$(":radio") |
All input elements with type="radio" |
:checkbox |
$(":checkbox") |
All input elements with type="checkbox" |
:submit |
$(":submit") |
All input elements with type="submit" |
:reset |
$(":reset") |
All input elements with type="reset" |
:button |
$(":button") |
All input elements with type="button" |
:image |
$(":image") |
All input elements with type="image" |
:file |
$(":file") |
All input elements with type="file" |
|
|
|
:enabled |
$(":enabled") |
All enabled input elements |
:disabled |
$(":disabled") |
All disabled input elements |
:selected |
$(":selected") |
All selected input elements |
:checked |
$(":checked") |
All checked input elements |
References :
http://codylindley.com/jqueryselectors/