Introduction to jQuery :: CharlotteJS
Upcoming SlideShare
Loading in...5
×
 

Introduction to jQuery :: CharlotteJS

on

  • 444 views

Slide deck from the 8/19/2010 CharlotteJS meetup.

Slide deck from the 8/19/2010 CharlotteJS meetup.

Statistics

Views

Total Views
444
Views on SlideShare
444
Embed Views
0

Actions

Likes
0
Downloads
8
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Introduction to jQuery :: CharlotteJS Introduction to jQuery :: CharlotteJS Presentation Transcript

  • introduction to jQuery Garrett Johnson // CharlotteJS // 8-19-2010 Friday, August 20, 2010
  • Me? Jr. Web Developer at Red Ventures Student I will program in just about anything. Started this joint! (with a lot of help from Nathan and Aaron) Friday, August 20, 2010
  • jQuery Seriously? "jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development." Friday, August 20, 2010
  • jQuery selectors manipulation effects attributes css ajax traversing events utilities Friday, August 20, 2010
  • Lets Get It A quick tour with some stops on the way. Feel free to stop and start discussion. Friday, August 20, 2010
  • document.ready? just an event.* gets triggered once the DOM is parsed/loaded. use as much as you want.* just put your <script></script> prior to </body> or right below the desired element. DOM is ready at this point. portability?* Friday, August 20, 2010
  • document.ready? 1.html Friday, August 20, 2010
  • selectors node type descendants attributes id child expressions* class name multiples more Friday, August 20, 2010
  • selectors 2.html Friday, August 20, 2010
  • selectors cache selectors selector context find() exact on the left, general on the right. avoid pure class or node selectors keep it simple! Friday, August 20, 2010
  • selectors 3.html Friday, August 20, 2010
  • wait... what the $ $ === jQuery $() is a factory.* returns “array like” collection of “jQuery” objects. not just css selectors. raw elements.* html.* Friday, August 20, 2010
  • wait... what the $ 4.html Friday, August 20, 2010
  • manipulation append html detach prepend filter each val *class more Friday, August 20, 2010
  • manipulation 5.html Friday, August 20, 2010
  • traversing parents next attributes children siblings *all prev find more Friday, August 20, 2010
  • traversing 6.html Friday, August 20, 2010
  • traversing / manipulation once you found it. do something. tons more features for traversing and manipulation. the docs are awesome. Friday, August 20, 2010
  • events binding proxy shorthands* custom live delegate namespaces delegation* more Friday, August 20, 2010
  • events find something. bind it. $(‘.foo’).bind(‘click’, fn); $(‘.foo’).click(fn); $(‘.foo’).live(‘click’, fn); $(‘#bar’).delegate(‘.foo’, ‘click’, fn)* Friday, August 20, 2010
  • events 7.html Friday, August 20, 2010
  • events bubbling. delegating. lower memory foot print. performance++ Friday, August 20, 2010
  • events 8.html Friday, August 20, 2010
  • events event.data clean up that repetitive code. binding time.* Friday, August 20, 2010
  • events 9.html Friday, August 20, 2010
  • events custom events clean up that repetitive code.** trigger time. Friday, August 20, 2010
  • events 10.html Friday, August 20, 2010
  • effects hide slide fadeOut show toggle delays animate fadeIn more Friday, August 20, 2010
  • effects nifty.... Friday, August 20, 2010
  • ajax get getJSON ajaxSetup post ajax events* load getScript more Friday, August 20, 2010
  • ajax shorthand methods the core ajax method default configuration events global local Friday, August 20, 2010
  • ajax 12.html Friday, August 20, 2010
  • extending plugins expressions Friday, August 20, 2010
  • extending 13.html Friday, August 20, 2010
  • what else? questions? favorite plugins? problems? Friday, August 20, 2010
  • peace! gtalk: gjj391 aim: gjohnson391 pdf/code will be on github.com/gjohnson Friday, August 20, 2010