jQuery Selectors

jQuery provides selectors based on CSS 1-3 and it’s custom selectors.

CSS selectors for common tasks:

  • Class selector: For class myDiv the selector is $(‘.myDiv’)
  • ID selector : For selecting a div with ID myPanel the selector will be $(‘#myPanel’)
  • Tag name: to select all paragraph nodes use $(‘p’)
  • Attribute selectors like
    • contains prefix [name|=”value”]
    • contains [name*=”value”]
    • contains word[name~=”value”]
    • ends with[name$=”value”]
    • equals[name=”value”],
    • not equal[name!=”value”],
    • starts with[name^=”value”],
    • has attribute [“name”] selector.
  • Parent child selector like “parent > child” for example to select all child li elements under div with id myPanel use $(‘div#myPanel > li’)
  • Custom selectors: jQuery have a number of custom selectors like animated, button, checked, contains(), disabled, empty, enabled, eq(), even, file, first-child, first, focus, gt(), has(), header, , hidden, image, input, last-child, last, lt(), not(), nth-child(), odd, only-child, parent, password, radio, reset, selected, submit, text, visible which can be used like $(‘div span:last-child’) to select all last span child of divs.
  • Descendant selector (“ancestor descedant”)  selects all the elements that are descendants of a given ancestor
  • Next Adjacent selector (“prev + next”) Selects all next elements matching “next” that are immediately preceded by a sibling “prev”
  • Next siblings selector (“prev ~ siblings”) Selects all sibling elements that follow after the “prev” element, have the same parent, and match the filtering “siblings” selector.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s