Show Menu

jQuery Cheat Sheet by

List of common jQuery selectors. I had compiled this list a while ago into a word document but do not remember the source now.
development     javascript     web     design     beginner     jquery

General

*
All
element
Element
.class
Class
#id
ID

Attributes

[name]
Has Attribute
[name|­="va­lue­"]
Contains Prefix (before hyphen (-))
[name*­="va­lue­"]
Contains
[name~­="va­lue­"]
Contains Word
[name^­="va­lue­"]
Starts With
[name$­="va­lue­"]
Ends With
[name=­"­val­ue"]
Equals
[name!­="va­lue­"]
Not Equal
[name=­"­v"][­nam­e2=­"­v2"]
Multiple Attributes

Controls

:button
Button
:checkbox
Checkbox
:submit
Submit
:text
Text
:password
Password
:radio
Radio
:reset
Reset
:file
File
:image
Image
:input
input, textarea, select and button elements
 

Functions

:conta­ins­(text)
Elements that contain the specified text.
:eq(n)
Element at index n within the matched set.
:gt(n)
Elements at an index greater than n within the matched set.
:lt(n)
Elements at an index less than index within the matched set.
:has(s­ele­ctor)
Elements which contain at least one element that matches the specified selector.
:not(s­ele­ctor)
Elements that do not match the given selector.
:nth-c­hild()
Elements that are the nth-child of their parent.
:empty
Elements that have no children (including text nodes).
:even
Even elements, zero-i­ndexed.
:first
The first matched element.
:header
Elements that are headers, like h1, h2, h3 and so on.
:last
The last matched element.
:odd
Odd elements, zero-i­ndexed.

Element State

:checked
Checked
:animated
Animated
:disabled
Disabled
:enabled
Enabled
:focus
Focused
:selected
Selected
:visible
Visible
:hidden
Hidden
 

Hierarchy

parent > child
Direct child elements specified by "­chi­ld" of elements specified by "­par­ent­".
ancestor descendant
Elements that are descen­dants of a given ancestor.
selector1, selector2, selectorN
Combined results of all the specified selectors.
prev + next
Next elements matching "­nex­t" that are immedi­ately preceded by a sibling "­pre­v".
prev ~ siblings
Sibling elements that follow after the "­pre­v" element, have the same parent, and match the filtering "­sib­lin­gs" selector.
:first­-child
Elements that are the first child of their parent.
:last-­child
Elements that are the last child of their parent.
:only-­child
Elements that are the only child of their parent.
:parent
Elements that are the parent of another element, including text nodes.

Download the jQuery Cheat Sheet

1 Page
//media.cheatography.com/storage/thumb/i3quest_jquery.750.jpg

PDF (recommended)

Alternative Downloads

Share This Cheat Sheet!

Like this cheat sheet? Check out our sponsors!

Readability-Score.com is a collection of tools to make your writing better. More readabile content means higher conversion rates and better reader engagement. Measure website and document readability, measure keyword density and more!

Click Here To Get Started!

 

Comments

DaveChild DaveChild, 09:07 24 Dec 11

I know this will make a lot of people very happy - a jQuery cheat sheet has been requested for a long time! Good job :)

Ben23 Ben23, 09:27 14 Jun 12

Should probably be called 'jQuery Selector Cheat Sheet' as it only covers that topic. Useful though, thanks,

simoneast simoneast, 08:01 8 Aug 12

Yeah, as Ben said it is only jQuery "selectors" - which are basically CSS selectors with a few helpful additions.

lek lek, 08:19 13 Aug 12

This will be great to some other beginners, like me.

Steen Steen, 21:43 11 Oct 12

Hmm, maybe it would be good to have the methods listed with args too. This is what I look up the most.

Add a Comment

Your Comment

Please enter your name.

    Please enter your email address

      Please enter your Comment.

          Related Cheat Sheets

          JavaScript Cheat Sheet
          Dojo 1.8 Cheat Sheet