jQuery Training
Introduction to jQuery
Gain an overview of jQuery, a fast, small, and feature-rich JavaScript library. Learn about its core features, how it simplifies HTML document traversal, event handling, and animation.
Getting Started with jQuery
Learn how to set up and include jQuery in your projects. Understand the basic syntax, how to use selectors, and how to perform common tasks like DOM manipulation and event handling.
DOM Manipulation
Explore how to manipulate the Document Object Model (DOM) using jQuery. Learn about methods for selecting, modifying, and deleting elements, as well as how to handle attributes and CSS styles.
Event Handling
Discover how to handle events using jQuery. Learn about different types of events, how to bind event handlers, and how to use event delegation to manage dynamic content.
Animations and Effects
Understand how to create animations and effects with jQuery. Learn about built-in methods for showing, hiding, fading, and sliding elements, and how to customize animations to enhance user experience.
AJAX with jQuery
Learn how to perform asynchronous HTTP requests using jQuery's AJAX methods. Discover how to load data from the server, handle responses, and update the content of your web pages dynamically.
Plugins and Extensions
Explore jQuery plugins and extensions to extend the functionality of jQuery. Learn how to use existing plugins, and how to create your own to add custom features to your applications.
Debugging and Best Practices
Discover best practices for writing and debugging jQuery code. Learn about common pitfalls, performance considerations, and techniques for maintaining clean and efficient jQuery code.
Hands-On Labs and Practical Projects
Engage in hands-on labs and practical projects to apply your jQuery skills. Work on real-world scenarios to develop proficiency in using jQuery for various web development tasks.
jQuery syllabus
jQuery Introduction
- Target Background
- References
- Unit Topics
- What Is jQuery?
- Benefits of Using a JavaScript Library
- jQuery Example
- CSS Selectors
- How to Use jQuery
- Practical Usage Notes
- Background – DOM
- Background - DOM Ready Events
- Background - JavaScript Functions
- The jQuery Function Object
- What Does the $() Function Take as Argument?
- What Does the $() Function do?
- The jQuery Wrapper
- The jQuery Wrapper as an Array-Like Object
- Note: innerHTML() vs. .html()
- jQuery Wrapper Chaining
- API Function Notation
- Handling DOM Ready Event
- xhtml Note
Selectors
- Background: The Sizzle Selector Engine
- Selecting Elements by Attribute
- Pseudo-Selectors
- Form Pseudo-Selectors
- Faster Selection
- Selecting Elements Using Relationships
- Selecting Elements Using Filters
- More on Chaining: .end()
- Testing Elements
- Is the Selection Empty?
- Saving Selections
- Iterating Through Selected Elements Using .each()
- JavaScript Methods
- JavaScript "this"
- Function Context
- The Function call() Method
- .each() Revisited
Style Class Manipulation
- Two Options
- Specifying Style Properties
- Setting Style Properties
- .addClass() / .removeClass()
- Defining a Stylesheet
- Setting & Getting Dimensions
- Attributes
DOM Manipulation
- The $ Function Revisited
- Getters and Setters
- The text() Element Method
- Appending DOM Elements
- Removing DOM Elements
- Performance
Events
- Event Overview
- Old School: Event Handling Using HTML Element Attributes
- Unobtrusive JavaScript
- Unobtrusive JavaScript Example
- Multiple Handlers
- Using jQuery Wrapper Event Registration Methods
- The .bind() Method
- Event Propagation
- Handlers for Elements Before They Exist!
- The Event Object
- Triggering Events
Utility Functions
- The jQuery Object Revisited
- Functions May Have Methods
- A jQuery Utility Function: $.trim()
- $.each()
- Example jQuery Utility Functions
Ajax
- Ajax Overview
- The Browser & the Server
- The Ajax Request
- The Ajax Response
- Sending an Ajax Request With jQuery - The General Case
- When This Code Is Executed…
- Sending an Ajax Request With jQuery - Simpler, Typical Case
- Data Types
- The .data() Method
Advanced Ajax
- A Form Example
- An Ajax Form Example
- Serialize()
- Get vs. Post
- More on Query Strings
- ajaxStart() and ajaxError()
Animations and Effects with jQuery and jQuery UI
- What is jQuery UI?
- Can I Do Animations and Effects Using jQuery Only?
- Hiding Elements with jQuery
- Using .hide() and .show() in jQuery
- Alternating an Element's Visibility in jQuery
- Adjusting the Speed in jQuery
- Providing a Handler in jQuery
- Using .slideUp() / .slideDown() Methods in jQuery
- jQuery UI Categories
- jQuery UI Interactions: Droppable and Draggable
- Droppable and Draggable More Complete Example
- jQuery UI Widgets: Datepicker
- jQuery UI Widgets: Autocomplete
Parsing JSON
- JSON
- Reading JSON from the Server Using Ajax
- Example File Contents
- Using the Results
- Optimized Version
- Getting More From the Response
- jqXHR Methods
- POST vs. GET
- Invalid JSON
- Using $.ajaxSetup()
Plugins
- What is a Plugin?
- Goal
- Self-Executing Anonymous Functions
- Meeting Our Goal
- Prototype Objects
- The jQuery Wrapper Class Revisited
- Example Plugin
- Using the Plugin
Training
Basic Level Training
Duration : 1 Month
Advanced Level Training
Duration : 1 Month
Project Level Training
Duration : 1 Month
Total Training Period
Duration : 3 Months
Course Mode :
Available Online / Offline
Course Fees :
Please contact the office for details