jQuery Development

Course:  JQUERY
Duration:  3 Days
Level:  I
Course Summary

This course provides the benefits of using the jQuery library in applications. Students will learn to embellish content using jQuery's DOM modification methods. This course will emphasize the simplicity of HTML and the dynamic decoration of those components using jQuery. Students will also learn to send and retrieve information with AJAX methods.

« Hide The Details
Topics Covered In This Course

Getting Started

  • What jQuery does?
  • History of the jQuery project
  • Downloading jQuery
  • Adding jQuery
  • Executing the code
  • Why jQuery works well
  • Our first jQuery-powered web page
  • Setting up the HTML document
  • Injecting the new class


  • The Document Object Model
  • CSS selectors
  • Attribute selectors
  • Custom selectors
  • Form selectors
  • Styling specific cells
  • Accessing DOM elements
  • The $() factory function
  • Styling list-item levels
  • Styling links
  • Styling alternate rows
  • DOM traversal methods
  • Chaining


  • Performing tasks on page load
  • Multiple scripts on one page
  • Coexisting with other libraries
  • Event handler context
  • Shorthand events
  • Event bubbling
  • Altering the bubble process
  • Stopping event propagation
  • Event delegation
  • Event namespacing
  • Simulating user interaction
  • Timing of code execution
  • Shortcuts for code brevity
  • Simple events
  • Further consolidation
  • Compound events
  • Side effects of event bubbling
  • Event targets
  • Default actions
  • Removing an event handler
  • Rebinding events
  • Keyboard events


  • Inline CSS modification
  • Effects and speed
  • Fading in and fading out
  • Creating custom animations
  • Animating multiple properties
  • Callbacks
  • Basic hide and show
  • Speeding in
  • Compound effects
  • Toggling the fade
  • Positioning with CSS

DOM Manipulation

  • Manipulating attributes
  • The $() factory function revisited
  • Moving elements
  • Wrapping elements
  • Clone with events
  • A CSS diversion
  • Non-class attributes
  • Inserting new elements
  • Marking, numbering, and linking the context
  • Copying elements
  • Cloning for pull quotes

Table Manipulation

  • Loading data on demand
  • Working with JavaScript objects
  • Global jQuery functions
  • Loading an XML document
  • Passing data to the server
  • Performing a POST request
  • Security limitations
  • Additional options
  • Appending HTML
  • Retrieving a JavaScript object
  • Executing a script
  • Choosing a data format
  • Performing a GET request
  • AJAX and events
  • Using JSON for remote data
  • The low-level AJAX method jQuery Forms
  • Sorting and paging
  • Preventing page refreshes
  • Row grouping tags
  • Column highlighting
  • Server-side pagination
  • JavaScript pagination
  • Modifying table appearance
  • Row striping
  • Interactive row highlighting
  • Filtering
  • Reversing the filters
  • Server-side sorting
  • JavaScript sorting
  • Basic alphabetical sorting
  • Alternating sort directions
  • Sorting and paging go together
  • Paging with sorting
  • Row highlighting
  • Advanced row striping
  • Tooltips
  • Filter options
  • Interacting with other code

Shufflers and Rotators

  • Forms and JavaScript
  • Conditionally displayed fields
  • Required fields
  • Checkbox manipulation
  • Placeholder text for fields
  • Keyboard navigation
  • Rejecting non-numeric input
  • Parsing and formatting currency
  • Other calculations
  • Deleting items
  • Required field messages
  • Form validation
  • Required formats
  • Compact forms
  • AJAX auto-completion
  • Working with numeric form data
  • Numeric calculations
  • Dealing with decimal places
  • Rounding values

Using Plugins

  • Page Rotators
  • The headline rotate function
  • Retrieving a feed from a different domain
  • Gradient fade effect
  • Setting up the page
  • Shuffling images when clicked
  • Image enlargement
  • Displaying a close button
  • Adding a loading indicator
  • Setting up the rotator
  • Pause on hover
  • Adding a loading indicator
  • An image carousel
  • Revising the styles with JavaScript
  • Adding sliding animation
  • Hiding the enlarged cover
  • More fun with badging

Developing Plugins

  • jQuery Plugins introduction
  • The Form plugin
  • Effects
  • Class animations
  • Additional effects
  • Widgets
  • Other recommended plugins
  • Tables Plugins
  • Charting Plugins
  • How to use a plugin
  • The jQuery UI plugin library
  • Color animations
  • Advanced easing
  • Interaction components
  • jQuery UI ThemeRoller
  • Forms Plugins
  • Images Plugins
What You Can Expect

At the end of this course, students will be able to:

  • Change page on command with DOM manipulation
  • Use AJAX to get the most out of server-side code
  • Build and control HTML tables dynamically
Who Should Take This Course

This course is designed for Developers

Recommended Prerequisites

Some Web development experience with JavaScript is required.

Training Style

Instructor led with 50% lecture and 50% lab.

« Hide The Details
Related Courses
Code Course Title Duration Level
Dojo Development
3 Days
jQuery Fundamentals
3 Days
jQuery Mobile
3 Days
Comprehensive jQuery Training
3 Days
JavaScript Programming Essentials
4 Days
Web Application Development Using HTML5
4 Days
HTML5 Advanced APIs
3 Days

Every student attending a Verhoef Training class will receive a certificate good for $100 toward their next public class taken within a year.

You can also buy "Verhoef Vouchers" to get a discounted rate for a single student in any of our public or web-based classes. Contact your account manager or our sales office for details.

Schedule For This Course
There are currently no public sessions scheduled for this course. We can schedule a private class for your organization just a couple of weeks from now. Or we can let you know the next time we do schedule a public session.
Notify me the next time this course is confirmed!
Can't find the course you want?
Call us at 800.533.3893, or
email us at [email protected]