jQuery Cheat Sheet – A Basic Guide to jQuery

*

Selects all the elements in the document

$("*")

.class

Specifies the class for an element to be selected.

$(".class")

element

Select and modify HTML elements 

$("element_name")

#id

Specifies an id for an element to be selected.

$("#id")

:hidden

Selects hidden elements to work upon.

$(":hidden")

:visible

Selects all the elements that are currently visible

$(":visible")

parent > child

Select all elements that are the direct child of parent.

("parent > child")

ancestor-descendant

Selects every descendant of a parent element.

$("parent descendant")

:animated

Change the state of the element with CSS style.

(selector).animate({styles}, para1, para2, para3);

:first

Selects the first element of the specified type.

$(":first")

:last

Selects the last element of the specified type.

$(":last")

:even

Selects even number index from the elements.

$(":even")

:odd

Selects odd number index from the elements.

$(":odd")

:input

Used to select input elements and button

$(":input")

:button

Selects button elements and input elements with type=”button”.

$(":button")

:parent

Selects elements that are parent of another element.

$(":parent")

:contains()

Elements containing the specified string are selected.

$(":contains(text)")

:first-child

Every element that is the first child of its parent is selected.

$(":first-child")

:nth-child()

Selects all elements that are the nth-child of their parent.

$("Element:nth-child(Index/even/odd/equation)")

[name!="value"]

Selects element that doesn’t have the specified value.

$("[attribute!='value']")

prev~siblings

("element ~ siblings")

prev + next

Selects the just “next” element 

$("element + next")

Sets or return properties and values for selected elements.

$(selector).prop(parameters)

Used to remove attributes from the selected elements.

$(selector).removeAttr(attribute)

Used to remove the property set by prop() method.

$(selector).removeProp(property)

Return or set the value of attribute for selected elements.

$(selector).val()

Removes data which was previously set.

$(selector).removeData(args);

Attaches or gets data for the selected elements.

$(selector).data(parameters);
 

Checks if an element has any data associated with it.

jQuery.hasData(element)

Checks the height of an element 

$("param").height()

Checks inner height of the element including padding.

$("param").innerHeight()

Finds total height of element including padding and border

$(selector).outerHeight(includeMargin)

Check the width of an element.

$("param").width()

Returns the inner width of the element include padding.

$("param").innerWidth()

Finds total width of element including border & padding.

$(selector).outerWidth( includemargin )

Changes the style property of the selected element.

$(selector).css(property)

Adds more property to each selected element.

$(selector).addClass(className);

Remove class names from the selected element.

$(selector).removeClass(class_name, function(index, current_class_name))

Check if the elements with specified class name exists

$(selector).hasClass(className);

Changes the class attached with selected element.

$(selector).toggleClass(class, function, switch)

Returns the vertical top position of the scrollbar.

$(selector).scrollTop(position)

Returns or sets the horizontal position of the scroll bar.

$(selector).scrollLeft(position)

Inserts content at the end of selected elements.

Inserts an HTML element at the end of selected element.

Sets or returns the innerHTML content of selected element.

Insert HTML elements or content at the beginning of selected element.

Sets or returns the text content of the element.

Makes a copy of selected elements including its child

Inserts HTML content before a specified element.

Inserts some HTML content after specified element.

Removes the selected elements from the DOM tree

Remove all child nodes and their content for selected elements.

Removes all the selected elements including the text.

Replaces the selected element with the new one.

Used to wrap specified element against all selected elements

Finds all the child element related to selected element.

Returns the next sibling of the selected element.

Returns the first ancestor of the selected element in DOM tree.

Finds the parent element related to the selected element.

Finds all the previous sibling elements between two elements.

Finds all siblings elements of the selected element.

Selects the first element from the specified elements.

Finds the last element of the specified elements.

Checks if one of the selected elements matches selectorElement.

Translates all items in an array or object to a new array.

Returns the element which match the criteria.

Returns all element which do not match with selected element

Adds the previous set of elements to current set.

Specifies the function to run for each matched element.

Finds all the descendant elements of selected element.

Attaches a function to run when an error event occurs

Triggers when the browser window change its size.

Used to scroll in specified element.

Loads the whole page then execute the rest code.

Performs unload event when user navigates away from current webpage.

Loads data from the server and returned it to the selected element.

Used to removes one or more event handlers, for selected elements.

Attachs event handlers to selected elements 

Triggers a specified event handler on selected element.

Used to trigger a specified event for the selected element.

Attaches one or more event handlers for the selected elements and child elements.

Removes event handlers attached with the on() method.

Attaches one or more event handlers to the selected element.

Used to remove any selected event handlers.

Used to remove focus from the selected element.

Used to focus on an element.

Focuses on the selected element.

Removes focus from the selected element.

Used to detect the change in value of input fields.

Triggers the keydown event whenever the User presses a key on the keyboard.

Triggers the keypress event whenever browser registers a keyboard input.

Used to trigger the keyup event whenever User releases a key from the keyboard.

Starts the click event or attach a function to run when a click event occurs.

Specifies functions to start when mouse pointer moves over selected element.

Checks the visibility of selected elements to toggle.

Works when mouse pointer moves over the selected elements.

Used to stop the windows propagation.

Used to stop the default action of the selected element to occur.

Used to hide the selected element.

Used to display the hidden and selected elements.

Check the visibility of selected elements to toggle 

Used to change the state of the element with CSS style.

Sets a timer to delay the execution in the queue.

Used to stop the animations running at the present time.

Removes all items from the queue that have not yet been run.

Removes the next function from the queue and executes it.

Used to change the opacity of selected elements.

Changes the level of opacity for selected element 

Changes the opacity of the selected element.

Toggles between the fadeIn() and fadeOut() methods.

Used to show the queue of functions to be executed

Used to stop the currently running animations.

Returns the utility object with methods to register multiple callbacks to queues.

Adds handlers which are called on the Deferred object 

Adds handlers which are called when deferred object is resolved.

Returns a Promise object to be observed when certain actions are ended.

Add handlers which are called when Deferred object is resolved or rejected.

Adds handlers which are to be called when Deferred object is rejected.

Loads data from the server by using the GET HTTP request.

Returns the index of the specified elements with respect to selector.

Executes callback functions depending on zero or more Thenable objects.

Counts the number of elements of the jQuery object.

Specifies the function to run for each matched element.

Returns the Callbacks object onto which it is attached (this).

Locks a callback list in the state.