Functions

JavaScript Functions

Selecting

Selecting DOM elements

1. Select an element by ID$('#foo')
2. Select DOM elements by CSS selector$(selector), $(selector, context)
3. Select elements by class name$('.foo')
4. Select elements by tag name$('div')

Traversing

DOM traversing

1. Get closest element by selector$.closest()
2. Get parent element node$.parent(), $.parents()
3. Get siblings of an element$.siblings(), $.next(), $.nextAll(), $.prev, $.prevAll()
4. Match element selector$.is()
5. Select the children of an element$.children()

Manipulation

Manipulating DOM elements

1. Append or prepend to an element$.append(), $.appendTo(), $.prepend(), $.prependTo()
2. Clone an element$.clone()
3. Create a DOM element$(string)
4. Empty an element’s content$.empty()
5. Get and set the HTML content of an element$.html()
6. Get the text content of an element$.text()
7. Insert an element after or before another$.after(), $.before(), $.insertAfter(), $.insertBefore
8. Iterating over a list of selected elements$.each()
9. Removing an element$.remove(), $.detach()
10. Replace a DOM element$.replaceAll(), $.replaceWith()
11. Unwrap a DOM element$.unwrap()
12. Wrap an HTML structure around an element$.wrap(), $.wrapAll()

Attributes

Element attributes

1. Adding, removing, and testing for classes$.addClass(), $.removeClass(), $.hasClass(), $.toggleClass()
2. Getting, setting, and removing attributes$.attr()
3. Set, get, and remove properties of DOM elements$.prop()
4. Setting, getting, and removing data attributes$.data()

Styles

Element styles, dimensions and positions

1. Get and set scroll position of an element$.scrollLeft(), $.scrollTop()
2. Get the offset position of an element relative to its parent$.position()
3. Get the position of an element relative to the document$.offset()
4. Getting width and height of an element$.width(), $.height(), $.outerWidth(), $.outerHeight(), $.innerWidth(), $.innerHeight()
5. Set and get CSS styles of elements$.css()

Ajax

Requests without a page load

1. JSONP Ajax requests
2. Load a script file asynchronously$.getScript()
3. Making CORS Ajax GET requests$.ajax()
4. Send Ajax GET and POST requests$.ajax(), $.get(), $.post(), $.getJSON()
5. Serialize form data into a query string$.serialize()
6. Serialize form data into an array$.serializeArray()

Events

Binding and unbinding events

1. Binding and unbinding of event handlers$.on(), $.bind(), $.live(), $.click(), $.focus(), $.submit(), etc.
2. Getting the current mouse position$.mousedown(), $.click(), $.mouse...
3. Getting the keycode from keyboard events$.keypress(), $.keyup(), $.keydown()
4. Live binding event handlers$.live(), $.on(), $.bind()
5. Preventing the default action or bubbling of eventse.preventDefault(), e.stopPropagation()
6. Running code when the document is ready$(document).ready()
7. Trigger an event$.trigger(), $.click(), $.focus(), $.submit(), etc.

Effects

Showing, hiding, fading, animating

1. Animate an element property$.animate(), $.slideUp(), $.slideDown(), $.fadeIn(), $.fadeOut()
2. Hide or show an element$.show(), $.hide(), $.toggle()

Utilities

Objects, strings, cookies, timing

1. Merge two JavaScript objects$.extend()
2. Parsing a JSON string$.parseJSON()
3. Set cookie, get cookie and delete cookie
4. Strip leading and trailing white-space from string$.trim()
5. Test if a certain value exists in an array$.inArray()