Sign In Start Free Trial

Learning jQuery 3

By : Jonathan Chaffer

2.7 (3)

Learning jQuery 3

2.7 (3)

By: Jonathan Chaffer

Overview of this book

If you are a web developer and want to create web applications that look good, are efficient, have rich user interfaces, and integrate seamlessly with any backend using AJAX, then this book is the ideal match for you. We’ll show you how you can integrate jQuery 3.0 into your web pages, avoid complex JavaScript code, create brilliant animation effects for your web applications, and create a flawless app. We start by configuring and customising the jQuery environment, and getting hands-on with DOM manipulation. Next, we’ll explore event handling advanced animations, creating optimised user interfaces, and building useful third-party plugins. Also, we'll learn how to integrate jQuery with your favourite back-end framework. Moving on, we’ll learn how the ECMAScript 6 features affect your web development process with jQuery. we’ll discover how to use the newly introduced JavaScript promises and the new animation API in jQuery 3.0 in great detail, along with sample code and examples. By the end of the book, you will be able to successfully create a fully featured and efficient single page web application and leverage all the new features of jQuery 3.0 effectively.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

Getting Started

Getting Started

What jQuery does?

Why jQuery works well?

What's new in jQuery 3?

Making our first jQuery-powered web page

Plain JavaScript versus jQuery

Using development tools

Summary

Selecting Elements

Selecting Elements

Understanding the DOM

Using the $() function

CSS selectors

Selector specificity

Attribute selectors

Custom selectors

DOM traversal methods

Iterating over jQuery objects

Accessing DOM elements

Summary

Exercises

Handling Events

Handling Events

Performing tasks on page load

Handling simple events

Event propagation

Altering the journey - the event object

Removing an event handler

Simulating user interaction

Summary

Exercises

Styling and Animating

Styling and Animating

Modifying CSS with inline properties

Hiding and showing elements

Effects and duration

Creating custom animations

Simultaneous versus queued effects

Summary

Exercises

Manipulating the DOM

Manipulating the DOM

Manipulating attributes and properties

DOM tree manipulation

Copying elements

Content getter and setter methods

DOM manipulation methods in a nutshell

Summary

Exercises

Sending Data with Ajax

Sending Data with Ajax

Loading data on demand

Choosing a data format

Passing data to the server

Keeping an eye on the request

Error handling

Ajax and events

Deferreds and promises

Summary

Exercises

Using Plugins

Using Plugins

Using a plugin

Other types of plugins

The jQuery UI plugin library

The jQuery Mobile plugin library

Summary

Exercises

Developing Plugins

Developing Plugins

Using the dollar ($) alias in plugins

Adding new global functions

Adding jQuery object methods

Providing flexible method parameters

Creating plugins with the jQuery UI widget factory

Plugin design recommendations

Summary

Exercises

Advanced Selectors and Traversing

Advanced Selectors and Traversing

Selecting and traversing revisited

Customizing and optimizing selectors

DOM traversal under the hood

Summary

Exercises

Advanced Events

Advanced Events

Revisiting events

Event delegation

Defining custom events

Throttling events

Extending events

Summary

Further reading

Exercises

Advanced Effects

Advanced Effects

Animation revisited

Observing and interrupting animations

Using global effect properties

Multi-property easing

Using deferred objects

Taking fine-grained control of animations

Summary

Exercises

Advanced DOM Manipulation

Advanced DOM Manipulation

Sorting table rows

Moving and inserting elements revisited

Storing data alongside DOM elements

Using HTML5 custom data attributes

Sorting and building rows with JSON

Revisiting attribute manipulation

Summary

Exercises

Advanced Ajax

Advanced Ajax

Implementing progressive enhancement with Ajax

Handling Ajax errors

Using the jqXHR object

Throttling Ajax requests

Extending Ajax capabilities

Summary

Exercises

Appnedix A – Testing JavaScript with QUnit

Appnedix A – Testing JavaScript with QUnit

Downloading QUnit

Setting up the document

Organizing tests

Adding and running tests

Other types of tests

Practical considerations

Summary

Appendix B – Quick Reference

Appendix B – Quick Reference

Selector expressions

DOM traversal methods

Event methods

Effect methods

DOM manipulation methods

Ajax methods

Deferred objects

Miscellaneous properties and functions

Customer Reviews

2.7 (3)

5 star

0

4 star

33.3%

3 star

33.3%

2 star

0

1 star

33.3%

Using the jqXHR object

When an Ajax request is made, jQuery determines the best mechanism available for retrieving the data. This transport could be the standard XMLHttpRequest object, the Microsoft ActiveX XMLHTTP object, or a <script> tag.

Because the transport used can vary from request to request, we need a common interface in order to interact with the communication. The jqXHR object provides this interface for us. It is a wrapper for the XMLHttpRequest object when that transport is used, and in other cases, it simulates XMLHttpRequest as best it can. Among the properties and methods it exposes are:

.responseText or .responseXML, containing the returned data
.status and .statusText, containing a status code and description
.setRequestHeader() to manipulate the HTTP headers sent with the request
.abort() to prematurely halt the transaction

This jqXHR object is returned from all of jQuery's Ajax...

Search

Your notes and bookmarks