SELECTORS - ATTRIBUTES CSS -
MANIPULATION - TRAVERSING -
EVENTS - EFFECTS - AJAX - CORE
JQUERY CSS
SELECTORS
Basic Content Filters Child Filters
“*” :contains() :first-child
.class :empty :first-of-type
element :has() :last-child
#id :parent :last-of-type
selector1, selectorN, ... :nth-child()
:nth-last-child()
Hierarchy Visibility Filters :nth-last-of-type()
:nth-of-type()
parent > child :hidden :only-child
ancestor descendant :visible :only-of-type()
prev + next
prev ~ siblings
Attributes Forms
Basic Filters
[name|="value"] :button :input
:animated :lang() [name*="value"] :checkbox :password
:eq() :last [name~="value"] :checked :radio
:even :lt() [name$="value"] :disabled :rest
:first :not() [name="value"] :enabled :selected
:gt() :odd [name!="value"] :focus :submit
:header :root [name^="value"] :file :text
:target [name] :image
[name="value"][name2="value2"]
ATTRIBUTES \ CSS
Attributes CSS Dimensions
.attr() .addClass() .height()
.prop() .css() .innerHeight()
.removeAttr() jQuery.cssHooks .innerWidth()
.removeProp() .hasClass() .outerHeight()
.val() .removeClass() .outerWidth()
.toggleClass() .width()
Data Offset
jQuery.data() .offset()
.data() .offsetParent()
jQuery.hasData() .position()
jQuery.removeData() .scrollLeft()
.removeData() .scrollTop()
MANIPULATION
Copying DOM Insertion, Around DOM Insertion, Inside
.clone() .wrap() .append()
.wrapAll() .appendTo()
.wrapInner() .html()
.prepend()
.prependTo()
DOM Removal DOM Insertion, Outside
.text()
.detach() .after()
.empty() .before() DOM Replacement
.remove() .insertAfter()
.unwrap() .insertBefore() .replaceAll()
.replaceWith()
TRAVERSING
Filtering Miscellaneous Tree Traversal
Traversing
.eq() .addBack() .parent()
.filter() .add() .children() .parents()
.first() .andSelf() .closest() .parentsUntil()
.has() .contents() .find() .prev()
.is() .each() .next() .prevAll()
.last() .end() .nextAll() .prevUntil()
.map() .nextUntil() .siblings()
.not()
.slice()
EVENTS
Browser Events Mouse Events Event Handler
Attachment
.error() event.currentTarget
.resize() event.data .bind()
.scroll() event.isDefaultPrevented() .delegate()
event.isImmediatePropagationStopped() .off()
event.isPropagationStopped() .on()
event.namespace .one()
Form Events event.pageX .trigger()
event.pageY .triggerHandler()
.blur()
event.preventDefault() .unbind()
.change()
event.relatedTarget .undelegate()
.focus()
event.result
.select()
event.stopImmediatePropagation()
.submit()
event.stopPropagation() Mouse Events
event.target
event.timeStamp .click()
Document Loading .dblclick()
event.type
event.which .focusin()
.holdReady()
.focusout()
.load()
.hover()
.ready() Keyboard Events
.mousedown()
.unload()
.mouseenter()
.keydown()
.mouseleave()
.keypress()
.mousemove()
.keyup()
.mouseout()
.mouseover()
.mouseup()
EFFECTS
Basics Custom Fading
.hide() .animate() .fadeIn()
.show() .clearQueue() .fadeOut()
.toggle() .delay() .fadeTo()
.dequeue() .fadeToggle()
jQuery.dequeue()
Sliding .finish()
jQuery.fx.interval
.slideDown() jQuery.fx.off
.slideToggle() .queue()
.slideUp() jQuery.queue()
.stop()
AJAX
Global Ajax Event Helper Functions Low-Level Interface
Handlers
jQuery.param() jQuery.ajax()
.ajaxComplete() .serialize() jQuery.ajaxSetup()
.ajaxError() .serializeArray()
.ajaxSend()
.ajaxStart()
Shorthand Methods
.ajaxStop()
.ajaxSuccess() jQuery.get()
jQuery.getJSON()
jQuery.getScript()
.load()
jQuery.post()
CORE
jQuery Object Utilities DOM Element Methods
jQuery() jQuery.contains() .get()
jQuery.noConflict() jQuery.each() .index()
jQuery.when() jQuery.extend() .size()
jQuery.globalEval() .toArray()
jQuery.grep()
jQuery.inArray()
Internals
Deferred Object jQuery.isArray()
jQuery.isEmptyObject()
.jquery
deferred.always() jQuery.isFunction()
.context
deferred.done() jQuery.isNumeric()
jQuery.error()
deferred.fail() jQuery.isPlainObject()
.length
deferred.notify() jQuery.isWindow()
.pushStack()
deferred.notifyWith() jQuery.isXMLDoc()
.selector
deferred.pipe() jQuery.makeArray()
deferred.progress() jQuery.map()
deferred.promise() jQuery.merge() Callbacks Object
deferred.reject() jQuery.noop()
deferred.rejectWith() jQuery.now() jQuery.Callbacks()
deferred.resolve() jQuery.parseHTML() callbacks.add()
deferred.resolveWith() jQuery.parseJSON() callbacks.disable()
deferred.state() jQuery.parseXML() callbacks.empty()
deferred.then() jQuery.proxy() callbacks.fire()
.promise() jQuery.support callbacks.fired()
jQuery.trim() callbacks.fireWith()
jQuery.type() callbacks.has()
jQuery.unique() callbacks.lock()
callbacks.locked()
callbacks.remove()
CSS - POSITIONING - HEIGHT & WIDTH - STYLESHEETS -
CLASS - ATTRIBUTES
jQuery CSS - CSS
Get css property of element. $(“#elementid”).(cssproperty);
Set multiple properties. $(“#elementid”).css({‘border’:’1px
solid red’, ‘font-size’ : ‘12px’,
‘font-weight:bold’});
Set single property. Set single property. $(“#elementid”).css(‘border’, ‘1px
solid red’);
jQuery CSS - Positioning
Get the offset (position var offset =
of element relative to $(“#elementid”).offset();
the page). Returned as alert(offset.left);
an object. alert(offset.top);
Get the position var position =
(position of element $(“#elementid”).offset();
relative to parent). alert(position.left);
Returned as object. alert(position.top);
Get scrollbar vertical $(window).scrollTop();
position. Works on any
element with scrollbar.
Set scrollbar vertical position. $(window).scrollTop(700);
Get scrollbar horizontal position. $(window).scrollLeft();
Set scrollbar horizontal position $(window).scrollLeft(400);
jQuery CSS - Height & Width
Get the current height of element. $(“#elementid”).height();
Set the current height of element. $(“#elementid”).height(120);
Get the current width of element. $(“#elementid”).width();
Set the current width of element. $(“#elementid”).width(170);
Get the inner height (height of element $(“#elementid”).innerHeight();
incl. padding excl. border) of element.
Get the inner width (width of element $(“#elementid”).innerWidth();
incl. padding excl. border) of element.
Get the outer height (height of element $(“#elementid”).outerHeight();
incl. padding and border) of element. If or
true param passed in also includes $(“#elementid”).outerHeight(true);
margin height.
Get the outer width of element $(“#elementid”).outerWidth();
(see outer height notes above). or
$(“#elementid”).outerWidth(true);
Stylesheets
Change single stylesheet. $("link[rel=stylesheet]").attr({href :
"css/sheet_a.css"});
Switch particular stylesheet. $("link[rel=stylesheet][href=css/sheet_c.css]").attr(
{href : "css/sheet_a.css"});
Add a stylesheet. $("head").append('<link rel="stylesheet"
type="text/css" href="css/sheet_a.css" />');
jQuery Attributes - Class
Add a class to an element. $(“#elementid").addClass(“class”);
Check element has a particular class. $(“#elementid").hasClass(“class”);
Remove a class from an element. $(“#elementid”).removeClass(“class”);
Remove a class if element has it $(“#elementid").toggleClass(“class”);
otherwise add the class.
jQuery Attributes - Attr
Get the ID of element. e.g. $(“#elementid div:firstchild").attr("id");
Set the ID of element. e.g. $(“#elementid div:firstchild").attr("id",
“my_new_id”);
Remove the ID attribute $(“#elementid”).removeAttr(“id”);
from an element.