0% found this document useful (0 votes)
185 views1 page

jQuery Selector and Function Basics

This document provides a summary of jQuery selectors, core functions, traversing methods, events, and AJAX capabilities. It outlines ways to select elements, access and manipulate the DOM, handle events, make asynchronous HTTP requests, and more. Key areas covered include selecting by id, class, and other attributes, traversing parents and children, binding and triggering events, low-level and shorthand methods for AJAX, and interoperability functions.

Uploaded by

swordenium
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
185 views1 page

jQuery Selector and Function Basics

This document provides a summary of jQuery selectors, core functions, traversing methods, events, and AJAX capabilities. It outlines ways to select elements, access and manipulate the DOM, handle events, make asynchronous HTTP requests, and more. Key areas covered include selecting by id, class, and other attributes, traversing parents and children, binding and triggering events, low-level and shorthand methods for AJAX, and interoperability functions.

Uploaded by

swordenium
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Selectors Core Traversing Events AJAX

Basics Hierarchy jQuery function Filtering Page Load Low-Level Interface


#id ancestor $ .jQuery( selector [, context] ), .jQuery( element ), $ .eq( index ) $ .ready( fn() ) XHR [Link]( options )
element descendant .jQuery( elementArray ), $ .first( ) 1.4+ Event Handling bool async = true fn beforeSend( XHR )
.class, parent > child .jQuery( jQueryObject ), .jQuery( ) 1.4∗∗ $ .last( ) 1.4+ bool cache = true fn complete(XHR, status)
$ .bind( type [, data ], fn(eventObj) )
.[Link] prev + next $ .jQuery( html [, ownerDocument] ), $ .has( selector ), str contentType obj context
.jQuery( html, props ) 1.4∗∗ $ .bind( type [, data], false ) 1.4∗∗
* prev ~ siblings .has( element ) 1.4+ $ .bind( array ) 1.4∗∗ obj, str data fn dataFilter( data, type )
selector1, $ .jQuery( fn ) $ .filter( selector ), .filter( fn(index) ) bool global = true bool ifModified = false
$ .unbind( [type] [, fn]) str jsonp fn jsonpCallback
selector2 jQuery Object Accessors bool .is( selector ) $ .one( type [, data ], fn(eventObj) ) str password bool processData = true
$ .each( fn(index, element) ) $ .map( fn(index, element) ) $ .trigger( event [, data])
Basic Filters Content Filters $ .not( selector ), .not( elements ), num timeout str type = 'GET'
num .size( ) obj .triggerHandler( event [, data]) str url = curr. page str username
:first :contains(text) , .length .not( fn( index ) )
:last :empty $ .delegate( selector, type, [data], handler) 1.4+ fn xhr str scriptCharset
str .selector $ .slice( start [, end] ) str dataType ∈ {xml, json, script, html}
:not(selector) :has(selector) $ .undelegate( [selector, type, [handler]]) 1.4+
el .context Tree traversal fn error( XHR, status, errorThrown )
:even :parent $ .eq( index ) Live Events fn success( data, status, XHR )
:odd $ .children( [selector] )
[Link]( str ) 1.4+ $ .live( eventType [, data], fn() ) [Link]( options )
:eq(index) Visibility $ .closest( selector [, context] ) 1.4∗∗
[el],el .get( [index] ) $ .die( ) 1.4+, .die( [eventType] [, fn() ])
:gt(index) Filters arr .closest( selectors [, context] ) 1.4+ Shorthand Methods
num .index( ) 1.4∗∗, .index( selector ) 1.4∗∗, $ .find( selector ) Interaction Helpers $ .load( url [, data] [, fn( responseText, status, XHR )] )
:lt(index) :hidden .index( element )
:visible $ .next( [selector] ) $ .hover( fnIn(eventObj), fnOut(eventObj)) XHR [Link]( url [, data] [, fn( data, status, XHR )] [, type] )
:header $ [Link]( elements, [name, arguments] ) $ .nextAll( [selector] ) $ .toggle( fn(eventObj), fn2(eventObj) [, ...]) XHR [Link]( url [, data] [, fn( data, status )] )
:animated arr .toArray( ) 1.4+ $ .nextUntil( [selector] ) 1.4+ Event Helpers XHR [Link]( url [, fn( data, status )] )
Child Filters Attribute Filters Interoperability $ .offsetParent( ) function ( [data,] [fn] ) XHR [Link]( url [, data] [, fn( data, status )] [, type] )
:nth-child(expr) [attribute] $ [Link]( [extreme] ) $ .parent( [selector] ) $ .blur, .mousedown, Global Ajax Event Handlers
:first-child [attribute=value] $ .parents( [selector] ) .change, .mouseenter, $ .ajaxComplete( fn( event, XHR, options ) )
:last-child [attribute!=value] Attributes $ .parentsUntil( [selector] ) 1.4+ .click, .mouseleave, $ .ajaxError( fn( event, XHR, options, thrownError ) )
:only-child [attribute^=value] Attributes $ .prev( [selector] ) .dblclick, .mousemove, $ .ajaxSend( fn( event, XHR, options ) )
[attribute$=value] str .attr( name ) $ .prevAll( [selector] ) .error, .mouseout, $ .ajaxStart( fn( ) )
[attribute*=value] $ .attr( name, val ), .attr( map ), $ .prevUntil( [selector] ) 1.4+ .focus, .mouseover, $ .ajaxStop( fn( ) )
[attribute|=value] .attr( name, fn(index, attr) ) $ .siblings( [selector] ) .focusin, 1.4+ .mouseup, $ .ajaxSuccess( fn(event, XHR, options) )
[attribute~=value] $ .removeAttr( name ) Miscellaneous .focusout, 1.4+ .resize,
[attribute] .keydown, .scroll, Miscellaneous
Class $ .add( selector [, context] ), str .serialize( )
[attribute2] .add( elements ), .add( html ) 1.4∗∗ .keypress, .select,
$ .addClass( class ), [obj] .serializeArray( )
.addClass( fn(index, class) ) 1.4∗∗ $ .andSelf( ) .keyup, .submit,
Forms Form Filters .load( [data,] fn ), .unload( [data,] fn ) str [Link]( obj, [traditional] ) 1.4∗∗
bool .hasClass( class ) $ .contents( )
:input :enabled $ .end( )
$ .removeClass( [class] ), Event object
:text :disabled .removeClass( fn(index, class) ) 1.4∗∗ event = {
Utilities
:password :checked
:radio :selected
$ .toggleClass( class [, switch] ), Manipulation el currentTarget, Browser and Feature Detection
obj [Link]
.toggleClass( fn(index, class) [, switch] ) 1.4∗∗ Inserting Inside * data,
:checkbox bool isDefaultPrevented(), obj [Link] deprecated
:submit HTML, text $ .append( content ),
.append( fn( index, html ) ) 1.4∗∗ bool isImmediatePropagationStopped(), str [Link] deprecated
:image str .html( ) bool isPropagationStopped(),
$ .html( val ), .html( fn(index, html) ) 1.4∗∗ $ .appendTo( target ) bool [Link] deprecated
:reset str namespace, 1.4+
:button str .text( ) $ .prepend( content ), num pageX, Basic operations
$ .text( val ), .text( fn(index, html) ) 1.4∗∗ .prepend( fn( index, html ) ) 1.4∗∗ num pageY, obj [Link]( obj, fn( index, valueOfElement ) )
:file
$ .prependTo( target ) preventDefault(), obj [Link]( [deep,] target, obj1 [, objN] )
Value
Inserting Outside el relatedTarget, arr [Link]( array, fn( element, index ) [, invert] )
str,[Link]( ) obj result, arr [Link]( obj )
Legend $ .val( val ), .val( fn() ) 1.4∗∗ $ .after( content ), .after( fn() ) 1.4∗∗
stopImmediatePropagation(), arr [Link]( array, fn( element, index ) )
$ .before( content ), stopPropagation(),
.before( fn() ) 1.4∗∗ num [Link]( val, array )
Conventional signs CSS $ .insertAfter( target )
el target,
arr [Link]( first, second )
[obj] — array of objects CSS num timeStamp,
$ .insertBefore( target ) str type, fn [Link] 1.4+
1.4+ — new in 1.4 str .css( name ) str which fn [Link]( fn, scope ), [Link]( scope, name ) 1.4+
$ .css( name, val ), .css( map ), Inserting Around
1.4∗∗ — changed in 1.4 } arr [Link]( array )
.css( name, fn(index, val) ) 1.4∗∗ $ .unwrap( ) 1.4+
str [Link]( str )
Data types $ .wrap( wrappingElement ),
* — anything
Positioning
obj .offset( )
.wrap( fn ) 1.4∗∗ Effects obj [Link]( str ) 1.4+
$ .wrapAll(wrappingElement ), Basics 1.4∗∗ Data functions
$ — jQuery object $ .offset( coord ), .offset( fn( index, coord ) ) 1.4+ .wrapAll( fn ) 1.4∗∗ $ .show( [ duration [, easing] [, fn] ] ) $ .clearQueue( [name] ) 1.4+
arr — array $ .offsetParent( ) $ .wrapInner( wrappingElement ), $ .hide( [ duration [, easing] [, fn] ] ) $ .dequeue( [name] ), [Link]( [name] )
obj .position( ) .wrapInner( fn ) 1.4∗∗ $ .toggle( [showOrHide] ) obj [Link]( element, key ), [Link]( ) 1.4+
bool — boolean int .scrollTop( )
Replacing $ .toggle( duration [, easing] [, fn] ) obj .data( ), .data( key )
el — DOM element $ .scrollTop( val ) $ .data( key, val ), .data( obj ) 1.4∗∗
$ .replaceWith( content ), Sliding 1.4∗∗
fn — function int .scrollLeft( ) .replaceWith( fn ) 1.4∗∗ $ .removeData( [name] )
$ .scrollLeft( val ) $ .slideDown( duration [, easing] [, fn] )
int — integer $ .replaceAll( selector ) [fn] .queue( [name] ) [Link]( [name] )
$ .slideUp( duration [, easing] [, fn] )
obj — object Height and Width Removing $ .slideToggle( [duration] [, easing] [, fn] )
$ .queue( [name,] fn( next ) ), [Link]( [name,] fn( ) )
str — string int .height( ) $ .detach( [selector] ) 1.4+ $ .queue( [name,] queue ), [Link]( [name,] queue )
$ .height( val ), .height( fn(index, height ) ) 1.4∗∗ Fading 1.4∗∗
XHR — XMLHttpRequest $ .empty( )
$ .fadeIn( duration [, easing] [, fn] )
Test operations
int .width( ) $ .remove( [selector] ) str [Link]( obj ) 1.4+
$ .width( val ), .width(( fn(index, height ) ) 1.4∗∗ $ .fadeOut( duration [, easing] [, fn] )
Copying bool [Link]( obj )
int .innerHeight( ) $ .fadeTo( [duration,] opacity [, easing] [, fn] )
[Link] int .innerWidth( ) $ .clone( [withDataAndEvents] ) Custom
bool [Link]( obj ) 1.4+
ver. 29-10-2010 bool [Link]( obj )
int .outerHeight( [margin] ) $ .animate( params [, duration] [, easing] [, fn] ) bool [Link]( obj ) 1.4+
int .outerWidth( [margin] ) $ .animate( params, options ) bool [Link]( obj ) 1.4+
$ .stop( [clearQueue] [, jumpToEnd] )
$ .delay( duration [, queueName] ) 1.4+
Settings
jQuery 1.4.3 API Cheat Sheet bool [Link]
num [Link] 1.4+

You might also like