Jquery 1.3.2 Cheat Sheet printable pdf download

Jquery 1.3.2 Cheat Sheet 2009-05-07 by Matt Kruse

Twitter:@matt_kruse

Home:

Core

Selectors

$(html) / $(element) / $(selector [,context])

$(func) === $(document).ready(func)

#id

.className

:visible

:hidden

each

(func)

$("img").each(function(i){

:enabled

:disabled

:checked

:selected

$()[i] === $().get(i)

this.src = "test" + i + ".jpg";

:nth-child(n) /

:first-child

:last-child

:only-child

/ :gt(n) / :lt(n)

$().length

/ $().size() / index(obj)

return false; // stop looping over each

:first

:last

:eq(0) / :nth(0)

$().selector() / $().context()

});

:header

:animated

:even

:odd

has no children (including text nodes)

Data

E:empty

.data(key) / .data(key,val) / .removeData(key)

Store/retrieve/remove arbitrary data tied to elements

E:not(s)

does not match simple selector s

.queue(name) / .queue(name, [fn|queue])

Retrieve an element's queue or add to/replace existing queue

E F

F element descendant of an E element

Attributes

F element child of an E element

attr(name) / attr(name,val) / attr({name:val})

attr(name, func)

F element immediately preceded by an E element

removeAttr(name)

$("img").attr("title", function() { return this.src });

F element preceded by an E element

addClass(c) / hasClass(c) / removeClass(c) / toggleClass(c[,switch])

E[foo]

contains a "foo" attribute

html() / html(content) / text() / text(content) / val() / val(value)

E[foo=bar]

"foo" attribute value is exactly equal to "bar"

"foo" attribute value begins exactly with "bar"

Traversing

E[foo^=bar]

add(expr) / add(html) / add(Element)

Append more elements to the set of matched elements

E[foo$=bar]

"foo" attribute value ends exactly with "bar"

contains('text')

$("div").contains('text') === $("div :contains('text')")

E[foo*=bar]

"foo" attribute value contains the substring "bar"

filter(expr) / filter(func)

Leave elements matching expr or func returning true

E[foo!=bar]

"foo" attribute is not equal to "bar"

find(expr)

$("p").find("span") === $("p span")

E[foo~=bar]

space-delimited "foo" attribute contains "bar"

is(expr [,expr])

Returns true if any in set matches expr. Complex selectors ok

E[foo=bar][baz=bop]

Match multiple attributes

next([expr]) / prev(expr)

Only immediate next/prev sibling [if expr matches]

:parent

elements which have child elements (including text)

nextAll([expr]) / prevAll(expr)

All next/previous siblings [if expr matches]

:contains('test')

elements which contain the specified text.

not(expr) / not(Element)

Removes matched elements from list

:input

All form elements, not just type=input

parent([expr])

Immediate parent, if matches expr

Types=

:password :radio :checkbox :submit :image :reset :button :file

parents([expr])

All parent elements matching expr

AJAX

Positioning offset parent

async: true

offsetParent()

$.ajax( properties )

Find closest parent element matching expr

$.ajaxSetup

( properties )

beforeSend: func(xhr)

closest(expr) === parents(expr :first)

cache: true (false=no caching)

siblings([expr]) / children([expr])

andSelf() / end()

$.get

( url, properties, fn(data) )

$.getJSON

(url,props,fn(json) )

complete: func(xhr, textStatus)

DOM Manipulation

$.getScript

( url, callback )

contentType: String

before(content) / after(content)

Creates a new sibling before/after element

$.post

( url, props, fn(data) )

data: {obj} | String

insertBefore(expr) / insertAfter(expr)

Attach selected elements as new sibling to others

ajaxComplete

( fn(xhr,props) )

dataFilter: func(data,type) - return sanitized data

prepend(content) / append(content)

Creates a new child node at the beginning/end

ajaxError

( fn(xhr,props) )

dataType: [xml,html,script,json,jsonp,text]

prependTo(expr) / appendTo(expr)

Attach selected elements to others, return attched

ajaxSend

( fn(xhr,props) )

error: func(xhr, textStatus, exception)

empty() - Removes all child nodes and content

remove()

ajaxStart

( fn(xhr,props) )

global: true (fire global events)

wrap(html)

$("p").wrap("<div class='wrap'></div>");

replaceWith(content) / replaceWith(expr)

ajaxStop

( fn(xhr,props) )

ifModified: false

wrapAll(html|elem) / wrapInner(html|elem)

ajaxSuccess

( fn(xhr,props) )

jsonp: String

clone([boolean])

Clone event handlers if passed true

.serialize()

processData:true

CSS

css(name) - get val from first element in list only

css(key,val) / css( {key:val, key:val} )

.serializeArray()

scriptCharset: String

offset() / position()

Returns {top,left} relative to doc or offset parent

.load

(url, props, fn(responseText,status,xhr) )

success: func(data, textStatus)

scrollTop([num]) / scrollLeft([num])

Scroll position of first element only

partial content using selector in url:

timeout: Number

height() / height(val) / width() / width(val)

innerHeight() / innerWidth()

$("#feed").load("feeds.php .results",

type: [POST,GET]

Pass false to ignore margins

{limit: 25},

url: string

outerHeight( [bool] ) / outerWidth( [bool] )

function(text,status,xhr) { alert("Loaded 25!");}

username: String / password: String (for auth)

Events (return false from handlers to cancel default action)

bind

(type,data,func) /

unbind

(type,func)

function handler(event) {

);

xhr: func (to create the XMLHttpRequest object)

one

(type, data, func) - execute only once

alert(event.data.foo);

Feature/Browser Detection

}

$.support.property

Check for browser support of features:

hover

(overfunc, outfunc)

$("p").bind("click", {foo: "bar"}, handler)

boxModel, cssFloat, hrefNormalized, htmlSerialize, leadingWhitespace, noCloneEvent, objectAll, opacity,

toggle

(evenfunc, oddfunc)

Executes browser's default action also

scriptEval, style, tbody

trigger

(type, data)

Trigger an event:

event

()

Bind a function to an event:

event

(fn)

$.browser.version

$.browser.[safari, opera, msie, mozilla]

EventTypes: blur, change, click, dblclick, error, focus, keydown, keypress, keyup, load, mousedown, mouseenter,

Misc

mouseleave, mousemove, mouseout, mouseover, mouseup, resize, scroll, select, submit, unload

$.each

(obj, func)

$.trim

(str) /

$.unique

(array)

trigger

(type, data)

Executes browser's default action also

$.each( [0,1,2], function(i, n){

$.extend

( target, prop1, propN )

live

(type,fn)

Handle event using event delegation

alert( "Item #" + i + ": " + n );

var options = { name: "bar" };

die

(type,fn)

Remove events added w/ live().

});

$.extend({validate:false,name:'foo'}, options);

$.each( {name:"John",lang:"JS"},function(i,n){

Result == { validate: false, name: "bar" }

Effects

Speeds: slow / normal / fast / #ms

alert( "Name: " + i + ", Value: " + n );

$.map

(array, func)

toggle

([boolean]) /

toggle

(speed,fn)

animate

(params, options)

});

$.map( [0,1,2], function(n){ return n + 4; });

animate

(params, speed, easing, callback)

stop

(clearQue,gotoEnd)

$.grep

( array, func, invert)

$.merge

(array, array) - removes dupes

hide/show

(speed [,callback])

fadeTo

(speed, opacity, callback)

$.grep( [0,1,2], function(n,i){ return n>0; }) == [1,2]

$.merge( [0,1,2], [2,3,4] ) === [0,1,2,3,4]

fadeIn/fadeOut

(speed, callback)

$.makeArray

(obj) === [obj]

$.inArray

(value, array)

slideDown/slideUp

(speed, callback)

slideToggle

(speed,callback)

$.isArray

(obj) /

$.isFunction

(obj)

$.inArray('y',['x','y','z']) == 1 (-1 if not found)

Set jQuery.fx.off=true to disable all current and queued animations

Jquery 1.3.2 Cheat Sheet

Related Articles

Related forms

Related Categories