Practical jQuery
Published on 9. July 2015
XXI, 320 pages
978-1-4842-0787-1 (ISBN)
Description
Practical jQuery is your step-by-step guide to using jQuery in the real world, taking you from downloading jQuery all the way to extending it by writing your own plug-ins and testing the DOM using QUnit. jQuery is one of today's most popular JavaScript web application development frameworks and libraries. While getting started with the tool is easy, sometimes it's not as simple to completely realize the power and automation that it can bring to your development work-and that's especially the case when you're in the middle of a project, up against a deadline.
Using this book, you will learn how to use jQuery's powerful DOM manipulation tools to dynamically update content on your site. You will be able to extend jQuery's capabilities by writing your own plugins on top of the framework, animate elements, build your own jQuery elements, employ best practices, and avoid common errors. Practical jQuery teaches you how, with jQuery, you can unit test and refactor your code. You'll see how expressive yet concise jQuery's code is and how much quicker and efficient it is to develop with jQuery.
Get a fundamental perspective on how jQuery works, how to understand, select, and build your own plug-ins, and how to make sure your projects run at the peak of their potential performance using Practical jQuery today.
More details
Other editions
Additional editions
Content
- Cover
- Contents at a Glance
- Contents
- About the Authors
- About the Technical Reviewer
- Acknowledgments
- Introduction
- Chapter 1: Evolution of jQuery
- Traditional JavaScript Basics
- The Window Object
- Methods
- Attributes
- Child Objects
- The Document Object
- The History Object
- The Location Object
- The Navigator Object
- The Screen Object
- Old School Challenges
- Challenges Pertaining to the Window Object
- Challenges Pertaining to the Document Object
- Challenges Related to the Globals
- Need for a Revolution
- Who Was the Revolutionary?
- Why jQuery?
- Minimal and Easy Coding
- Readable/Clean Code
- Easy CSS Handling
- Animation Methods
- Intuitive Function Calls
- Summary
- Chapter 2: Getting Started with jQuery
- Document Object Model (DOM)
- Downloading and Setting Up jQuery
- Downloading from the Official Web Site
- Including jQuery from a CDN
- Clone from GitHub
- jQuery Fundamentals
- jQuery Syntax
- Document Ready Event
- jQuery noConflict() Method
- jQuery Selectors
- Selector Examples
- Selector Fact Files
- Use of ID-Based Selectors
- Be Specific but Avoid Excessive Specificity
- Don't Repeat Selectors
- Avoid the Universal Selector
- Working with jQuery
- The Problem Statement
- The Anonymous Function
- Preloading Images with jQuery
- each() in jQuery
- Summary
- Chapter 3: Traversing DOM with jQuery
- Selecting Elements with CSS Selectors
- Type Selector
- Universal Selector
- Attribute Selector
- Class Selector
- ID Selector
- Pseudo Class Selector
- Relationship-Based Selectors
- Using jQuery Selectors
- Type Selector
- Universal Selector
- Attribute Selector
- Class Selector
- ID Selector
- Pseudo Class Selector
- Other jQuery Selectors
- Traversing DOM with jQuery Traversal Methods
- The Curtain Raiser
- jQuery Methods for DOM Traversal
- The parent( ) Method
- The parents( ) Method
- The parentsUntil( ) Method
- The closest( ) Method
- The children( ) Method
- The find( ) Method
- The prev( ) Method
- The next( ) Method
- The siblings( ) Method
- Caching Selector and Chaining Methods
- Selector Caching
- Chaining
- jQuery Filtering
- The .eq() Method
- The .filter() Method
- The .first() Method
- The .last() Method
- The .has() Method
- The .is() Method
- The .not() Method
- Summary
- Chapter 4: DOM Manipulation with jQuery
- Editing Appearance with jQuery CSS Methods
- Obtaining CSS Properties
- Setting CSS Properties
- Setting CSS Properties Using Calculations
- Setting Multiple CSS Properties
- Editing/Changing an Element's Attributes, Contents, and Position
- Editing Attributes
- Editing Contents
- .text()
- .html( )
- .position( )
- Creating and Inserting New DOM Elements
- .append() vs. .appendTo()
- Inserting New Elements in Specific Locations
- Putting the Methods to Work
- Removing and Cloning DOM Elements
- Working with Dimensions
- jQuery width() and height() Methods
- jQuery innerWidth() and innerHeight() Methods
- jQuery .outerWidth() and .outerHeight() Methods
- Summary
- Chapter 5: Events in jQuery
- Introducing Events
- Browsers and Events
- Event Listeners and Event Handlers
- The Event( ) Method in jQuery
- Binding Events
- Unbinding Events
- Events Propagation and Events Bubbling
- The Event Capturing and Event Bubbling Models
- The W3C Event Model
- Callback Action in Event
- Summary
- Chapter 6: Real World Events in jQuery
- Common Gotchas in Event Handling
- Handling Dynamic Elements
- The Problem
- The Solution
- Handling jQuery Animation Buildup
- The Prelude
- The Problem
- The Solution
- Preventing Event Propagation and Bubbling
- Handling the Event Queue
- How Handling Works in a jQuery Event Queue
- The jQuery queue( ) Method
- Building a jQuery UI Accordion
- Using the jQuery UI Accordion
- Customizing an Accordion
- Validating Form Elements
- Using the Validate Plug-in
- Validating Form Elements Using Customized jQuery
- Summary
- Chapter 7: Animation in jQuery
- Life Without jQuery
- jQuery's animate( )
- Fading in jQuery
- Using the fadeOut( ) Method
- Using the fadeIn( ) Method
- Using the fadeTo( ) Method
- Using the fadeToggle( ) Method
- Sliding in jQuery
- Using the slideUp( ) Method
- Using the slideDown( ) Method
- Using the slideToggle( ) Method
- Toggle( ) in jQuery
- Creating a Basic Light Box
- Controlling Animation Behavior
- Smoothing Your Animations
- Using the fx Object to Control Frame Rate
- Turning Off Your Animation
- Creating a Basic Image Slider
- Summary
- Chapter 8: Ajax with jQuery
- Introducing Ajax
- How Did Ajax Originate?
- The Technologies That Make Up Ajax
- Ajax Using jQuery
- The Nuts and Bolts of Ajax in JavaScript
- The jQuery Approach
- Understanding the "Mother" ajax( )
- Commonly Used ajax( ) Functions
- The load() Method
- The get() Method
- The post() Method
- Introducing JSON
- Understanding JSON
- Parsing JSON with JavaScript
- Parsing Without Using Library Methods
- Parsing with the parse( ) Method
- Parsing with the eval( ) Method
- Using the jQuery Alternative to JavaScript
- Ajax and JSON Usage Example
- Summary
- Chapter 9: Creating Plug-ins with jQuery
- What Is a Plug-in?
- Plug-in Best Practices
- Private Variables
- Public Variables
- Parameters
- Plug-in Writing Guidelines
- Do You Really Need the Plug-in?
- Reuse What Already Exists
- Preserve the Reference to jQuery
- Do Not Unnecessarily Modify Objects
- Ensure Chainability
- Creating a Form Validation Plug-in
- Creating an Accordion Plug-in
- Summary
- Chapter 10: Integrating Plug-ins with jQuery
- Plug-in Repositories
- The jQuery Registry
- The NPM Open Source Package Repository
- The GitHub Repository
- Integrating Plug-ins
- Downloading and Saving
- Do a Test Run on Some Simple Elements
- Include the Plug-in File in the script Tag
- The Dilemma-in the Head or at the End of the Body
- Keep the Code Clean
- Plug-in Customization
- Minifying Code for Distribution
- Compression vs. Minification
- What Does Minified Code Look Like?
- There Is More: Uglification and Beautification
- Summary
- Chapter 11: Using jQuery Frameworks
- JavaScript and jQuery Frameworks
- Bootstrap
- Some Important Methods
- Using Bootstrap Grid
- Adding Buttons and Icons
- Adding a Navigation Bar with Bootstrap
- AngularJS
- Components in jQuery
- jQuery UI
- Drag and Drop Using jQuery UI
- Autocomplete
- Datepicker
- jQuery Mobile
- Some Cool Features of jQuery Mobile
- Responsive Web Design
- Ajax Navigation System
- Ajax and Hash Driven Page Navigation
- Pop-ups in jQuery Mobile
- Summary
- Chapter 12: Testing jQuery with QUnit
- QUnit as a JavaScript Framework
- Introduction to Unit Testing
- The Need for Unit Testing
- Why QUnit?
- Getting Started with QUnit
- QUnit Syntax
- Styling the Test Result
- Writing the First Test Case
- Commonly Used QUnit Methods
- equal
- strictEqual
- notEqual
- deepEqual
- ok
- notOk
- Testing DOM Manipulation
- Refactoring Code
- A Simple Refactoring
- Moving Ahead in Refactoring
- Writing Another Test Case on the Refactored Code
- Summary
- Index
