jQueryThe write less, do more JavaScript Framework

Agenda

•jQuery - Was ist jQuery?

•jQuery Basics

•jQuery Plugins

•jQuery Documentation

Was ist jQuery?

•JavaScript Framework

•einfache DOM / HTML manipulation

•Animationen

•Event handling

•AJAX

Wer ist jQuery?

•John Resig

•Barcamp New York

•derzeit > 20 developers

Wie arbeitet jQuery?

Find this, do something!

•$('#message1').show('medium');

•$('#message1').addClass('alert');

$

•$(CSS Selector)

•$(Attribute matching)

•$(XPath)

$CSS:

•$('p');

•$('p.message');

•$('#message .text');

•$('ul#menu > li');

•$('ul#menu ul');

$Attribute Matching:

•$('img[@alt]');

•$('a[@href*=google]');

Many more: XPath, :eq(n), :gt(n), etc...

Learning by doing!

http://jquery.jowe.biz

$

•$('#message2') .fadeIn('slow') .addClass('alert');

Learning by doing!

http://jquery.jowe.biz

DOM ready?

$(document).ready(function() {

// start coding

});

Was kann jQuery?•Animations

fadeIn(speed, callback)fadeOut(s, c)hide(s, c)show(s, c)slideDown(s, c)

slideUp(s, c)toggle(s, c)slideToggle(s, c)fadeTo(s, c)animate(s, c)

Was kann jQuery?•.children()

•.children(expression)

•.parent()

•.parent(expression)

•.find(expression)

•.filter(function)

•.eq(index)

•dsad

Plugins

•plugins.jquery.com

•google.com

Documentation

•docs.jquery.com

•visualjquery.com

Fragen / Anregungen?