Thursday, 30 June 2011

All JQuery Selectors with example


Selector
Example
Selects
$("*")
All elements
$("#lastname")
The element with id=lastname
$(".intro")
All elements with class="intro"
$("p")
All <p> elements
.class.class
$(".intro.demo")
All elements with class=intro and class=demo
$("p:first")
The first <p> element
$("p:last")
The last <p> element
$("tr:even")
All even <tr> elements
$("tr:odd")
All odd <tr> elements
$("ul li:eq(3)")
The fourth element in a list (index starts at 0)
$("ul li:gt(3)")
List elements with an index greater than 3
$("ul li:lt(3)")
List elements with an index less than 3
$("input:not(:empty)")
All input elements that are not empty
$(":header")
All header elements <h1><h2>...

All animated elements
$(":contains('Ravi')")
All elements which contains the text Ravi
$(":empty")
All elements with no child (elements) nodes
:hidden
$("p:hidden")
All hidden <p> elements
$("table:visible")
All visible tables
s1,s2,s3
$("th,td,.intro")
All elements with matching selectors
$("[href]")
All elements with an href attribute
$("[href='#']")
All elements with href attribute value="#"
$("[href!='#']")
All elements with href attribute value<>"#"
$("[href$='.jpg']")
All elements with href attribute value containing ".jpg"
$(":input")
All <input> elements
$(":text")
All <input> elements with type="text"
$(":password")
All <input> elements with type="password"
$(":radio")
All <input> elements with type="radio"
$(":checkbox")
All <input> elements with type="checkbox"
$(":submit")
All <input> elements with type="submit"
$(":reset")
All <input> elements with type="reset"
$(":button")
All <input> elements with type="button"
$(":image")
All <input> elements with type="image"
$(":file")
All <input> elements with type="file"
$(":enabled")
All enabled input elements
$(":disabled")
All disabled input elements
$(":selected")
All selected input elements
$(":checked")
All checked input elements

Note: Do NOT start an ID name with a number! It will not work in Mozilla/Firefox.
Tip: Do NOT start a class name with a number! This is only supported in Internet Explorer.

No comments:

Post a Comment