jQuery Training

How To Take This Class

Live Instructor-Led Online Class

Cost: $975.00

  • Open enrollment class for individuals
  • Live class with an instructor
  • Free class retakes forever!
  • Six months of instructor email support
  • Hands-on exercises and student labs
  • Classes never cancelled due to low enrollment
  • Money-back guarantee

Onsite or Offsite Group Training

Cost: Based on number of students

  • For groups as small as 3 people
  • Class Held at our location or yours
  • Hands-on exercises and student labs
  • Customization at no extra charge
  • Six months of instructor email support
  • All-inclusive pricing
  • Money-back guarantee
Request Group Pricing Proposal

Course Duration

3 Days

Course Description

To build interesting, interactive sites, developers are turning to JavaScript libraries such as jQuery to automate common tasks and simplify complicated ones. Because many web developers have more experience with HTML and CSS than with JavaScript, the library's design lends itself to a quick start for designers with little programming experience. Experienced programmers will also be aided by its conceptual consistency. In this jQuery Training course students will learn the basics of jQuery for adding interactions and animations to pages.Starting with an introduction to jQuery, students will first be shown how to write a functioning jQuery program in just three lines of code. Students will then learn how to add impact to actions through a set of simple visual effects and to create, copy, reassemble, and embellish content using jQuery's DOM modification methods. The course will step you through many detailed, real-world examples, and even equip you to extend the jQuery library itself with your own plug-ins.

Course Objectives

After successful completion of this course, students will be able to:
  • Create interactive elements for web designs
  • Learn how to create the best user interface for web applications
  • Use selectors in a variety of ways
  • Make things happen on webpages with events
  • Add flair to actions with a variety of animation effects

Course Audience

This course is for web designers who want to create interactive elements for their designs, and for developers who want to create the best user interface for their web applications. Basic JavaScript programming and knowledge of HTML and CSS is required. No knowledge of jQuery is assumed, nor is experience with any other JavaScript libraries

Course Prerequisites

Basic JavaScript programming and knowledge of HTML and CSS is required. No knowledge of jQuery is assumed, nor is experience with any other JavaScript libraries

Course Syllabus

  1. Getting Started
    • What jQuery does
    • Why jQuery works well
    • Our first jQuery-powered web page
    • Downloading jQuery
    • Setting up jQuery in an HTML document
    • Adding our jQuery code
    • Finding the poem text
    • Injecting the new class
    • Executing the code
    • The finished product
    • Plain JavaScript vs. jQuery
    • Development tools
    • Firebug
  2. Selecting Elements
    • The Document Object Model
    • The $() function
    • CSS selectors
    • Styling list-item levels
    • Attribute selectors
    • Styling links
    • Custom selectors
    • Styling alternate rows
    • Form selectors
    • DOM traversal methods
    • Styling specific cells
    • Chaining
    • Accessing DOM elements
    • Hands-on Exercises
  3. Handling Events
    • Performing tasks on page load
    • Timing of code execution
    • Multiple scripts on one page
    • Shortcuts for code brevity
    • Passing an argument to the .ready() callback
    • Simple events
    • A simple style switcher
    • Enabling the other buttons
    • Event handler context
    • Further consolidation
    • Shorthand events
    • Compound events
    • Showing and hiding advanced features
    • Highlighting clickable items
    • The journey of an event
    • Side effects of event bubbling
    • Altering the journey: the event object
    • Event targets
    • Stopping event propagation
    • Default actions
    • Event delegation
    • Methods for event delegation
    • Removing an event handler
    • Event namespacing
    • Rebinding events
    • Simulating user interaction
    • Keyboard events
    • Hands-on Exercises
  4. Styling and Animating
    • Inline CSS modification
    • Basic hide and show
    • Effects and speed
    • Speeding in
    • Fading in and fading out
    • Sliding up and sliding down
    • Compound effects
    • Creating custom animations
    • Building effects by hand
    • Animating multiple properties at once
    • Positioning with CSS
    • Simultaneous versus queued effects
    • Working with a single set of elements
    • Bypassing the queue
    • Manual queueing
    • Working with multiple sets of elements
    • Callbacks
    • Hands-on Exercises
  5. Manipulating the DOM
    • Manipulating attributes
    • Non-class attributes
    • Value callbacks
    • DOM element properties
    • DOM tree manipulation
    • The $() function revisited
    • Creating new elements
    • Inserting new elements
    • Moving elements
    • Wrapping elements
    • Inverted insertion methods
    • Copying elements
    • Cloning for pull quotes
    • Content getter and setter methods
    • Further style adjustments
    • DOM manipulation methods in a nutshell
    • Hands-on Exercises
  6. Sending Data with Ajax
    • Loading data on demand
    • Appending HTML
    • Working with JavaScript objects
    • Retrieving JSON
    • Global jQuery functions
    • Executing a script
    • Loading an XML document
    • Choosing a data format
    • Passing data to the server
    • Performing a GET request
    • Performing a POST request
    • Serializing a form
    • Delivering different content for Ajax requests
    • Keeping an eye on the request
    • Error handling
    • Ajax and events
    • Security limitations
    • Using JSONP for remote data
    • Additional options
    • The low-level Ajax method
    • Modifying default options
    • Loading parts of an HTML page
    • Hands-on Exercises
  7. Using Plugins
    • Finding plugins and help
    • How to use a plugin
    • Downloading and referencing the Cycle plugin
    • Simple plugin use
    • Specifying plugin method parameters
    • Parameter defaults
    • Other types of plugins
    • Custom selectors
    • Global function plugins
    • The jQuery UI plugin library
    • Effects
    • Color animations
    • Class animations
    • Advanced easing
    • Additional effects
    • Interaction components
    • Widgets
    • jQuery UI ThemeRoller
    • Hands-on Exercises
  8. Developing Plugins
    • Use of the $ alias in plugins
    • Adding new global functions
    • Adding multiple functions
    • Adding jQuery object methods
    • Object method context
    • Implicit iteration
    • Method chaining
    • Method parameters
    • Parameter maps
    • Default parameter values
    • Callback functions
    • Customizable defaults
    • The jQuery UI widget factory
    • Creating a widget
    • Destroying widgets
    • Enabling and disabling widgets
    • Accepting widget options
    • Adding sub-methods
    • Triggering widget events
    • Plugin design recommendations
    • Plugin distribution
    • Hands-on Exercises
  9. Advanced Selectors and Traversing
    • Selecting and traversing revisited
    • Dynamic table filtering
    • Table row striping
    • Combining filtering and striping
    • More selectors and traversal methods
    • Customizing and optimizing selectors
    • Writing a custom selector plugin
    • Selector performance
    • Sizzle selector implementation
    • Testing selector speed
    • DOM traversal under the hood
    • jQuery object properties
    • The DOM element stack
    • Writing a DOM traversal method plugin
    • DOM traversal performance
    • Improving performance using chaining
    • Improving performance using caching
    • Hands-on Exercises
  10. Advanced Events
    • Events revisited
    • Loading additional pages of data
    • Displaying data on hover
    • Event delegation
    • Using jQuery's delegation methods
    • Choosing a delegation method
    • Delegating early
    • Using a context argument
    • Custom events
    • Infinite scrolling
    • Custom event parameters
    • Throttling events
    • Other ways to perform throttling
    • Special events
    • More about special events
    • Hands-on Exercises
  11. Advanced Effects
    • Animation revisited
    • Observing and interrupting animations
    • Determining the animation state
    • Halting a running animation
    • Caution when halting animations
    • Global effect properties
    • Globally disabling all effects
    • Fine-tuning animation smoothness
    • Defining effect durations
    • Multi-property easing
    • Deferred objects
    • Animation promises
    • Hands-on Exercises
  12. Advanced DOM Manipulation
    • Sorting table rows
    • Server-side sorting
    • Ajax sorting
    • JavaScript sorting
    • Moving and inserting elements, revisited
    • Adding links around existing text
    • Sorting simple JavaScript arrays
    • Sorting DOM elements
    • Storing data alongside DOM elements
    • Performing additional precomputation
    • Storing non-string data
    • Alternating sort directions
    • Using HTML5 custom data attributes
    • Sorting and building rows with JSON
    • Modifying the JSON object
    • Rebuilding content on demand
    • Advanced attribute manipulation
    • Shorthand element creation
    • DOM manipulation hooks
    • Writing a CSS hook
    • Hands-on Exercises
  13. Advanced Ajax
    • Progressive enhancement with Ajax
    • Harvesting JSONP data
    • Ajax error handling
    • The jqXHR object
    • Ajax promises
    • Caching responses
    • Throttling Ajax requests
    • Extending Ajax capabilities
    • Data type converters
    • Ajax prefilters
    • Alternate transports
    • Hands-on Exercises
  14. Appendix A: JavaScript Closures
    • Inner functions
    • The great escape
    • Variable scoping
    • Interactions between closures
    • Closures in jQuery
    • Arguments to $(document).ready()
    • Event handlers
    • Binding handlers in loops
    • Named and anonymous functions
    • Memory leak hazards
    • Accidental reference loops
    • The Internet Explorer memory leak problem
    • The good news
  15. Appendix B: Testing JavaScript with QUnit
    • Downloading QUnit
    • Setting up the document
    • Organizing tests
    • Adding and running tests
    • Asynchronous testing
    • Other types of tests
    • Practical considerations
    • Further reading
  16. Appendix C: Quick Reference
    • Selector expressions
    • Simple CSS
    • Position among siblings
    • Position among matched elements
    • Attributes
    • Forms
    • Other custom selectors
    • DOM traversal methods
    • Filtering
    • Descendants
    • Siblings
    • Ancestors
    • Collection manipulation
    • Working with selected elements
    • Event methods
    • Binding
    • Shorthand binding
    • Special shorthands
    • Triggering
    • Shorthand triggering
    • Utility
    • Effect methods
    • Predefined effects
    • Custom animations
    • Queue manipulation
    • DOM manipulation methods
    • Attributes and properties
    • Content
    • CSS
    • Dimensions
    • Insertion
    • Replacement
    • Removal
    • Copying
    • Data
    • Ajax methods
    • Issuing requests
    • Request monitoring
    • Configuration
    • Utilities
    • Deferred objects
    • Object creation
    • Methods of deferred objects
    • Methods of promise objects
    • Miscellaneous properties and functions
    • Properties of the jQuery object
    • Arrays and objects
    • Object introspection