Course 466:
jQuery Web Development

(3 days)


Course Description

Integrating Asynchronous JavaScript and XML (AJAX) techniques into applications is quite common in today’s rapidly moving world of Web development. In this course, students will learn how to enhance their Web applications using the jQuery script library and significantly boost their productivity. Topics covered include using jQuery selectors, handling events, manipulating the DOM, and calling different types of services to retrieve data. Additional information about enhancing pages with jQuery animations will also be covered.

Learning Objectives

  • How jQuery can enhance productivity
  • What the jQuery is and why it’s so popular
  • Selecting DOM objects using jQuery selectors
  • The role of jQuery event handlers
  • How to chain jQuery functions
  • DOM manipulation techniques including adding and removing nodes
  • How to send and receive data from Web Services
  • jQuery animation techniques
  • jQuery UI Features
  • How to use jQuery Plugins
  • Creating custom plugins
  • jQuery templates
  • Client-side data binding techniques


Experience building applications that use HTML, CSS, and JavaScript.

Course Outline

Getting Started with jQuery

  • Getting Started with jQuery
  • Introduction to Selectors
  • Understanding Control Chaining
  • Detecting When a Page Has Loaded

The jQuery Event Model

  • jQuery Event Model Benefits
  • Handling Click Events
  • Using bind() and unbind()
  • Handling Hover Events
  • Accessing Event Properties

Manipulating the DOM with jQuery

  • Using the each() Command
  • Modifying Object Properties
  • Modifying Attributes
  • Adding and Removing Nodes
  • Modifying Styles and CSS Classes
  • Reading and Modifying Element Text with the html() Command
  • Extracting Text with the text() Command
  • Using the wrap() Command

jQuery AJAX Features

  • jQuery AJAX Functions
  • Loading HTML Content from the Server
  • Making GET Requests
  • Making POST Requests
  • Using the ajax() Function
  • Using the serialize() Function

jQuery Animations and Effects

  • Showing and Hiding Elements
  • Toggling Elements with the toggle() Function
  • Fading In and Out
  • Sliding Up and Down
  • Custom Animations

jQuery UI and Plugins

  • Using jQuery UI
  • Working with Data Plugins
  • Using DataTables for Grids
  • Filtering Plugins
  • Creating Custom Plugins

jQuery Templates

  • Why Use Client-Side Templates?
  • Template Tokens
  • Binding JSON Data
  • Working with Conditionals and Loops
  • Nesting Templates
  • jQuery Template Examples

Client-Side Data Binding

  • Data Binding Techniques
  • Using Data Linking
  • Working with KnockOutJS

Please Contact Your ROI Representative to Discuss Course Tailoring!