jQuery in Action
Bear Bibeault and Yehuda Katz
  • January 2008
  • ISBN 9781933988351
  • 376 pages
  • printed in black & white
This title is out of print and no longer for sale.

Solve your complex UI problems in no time. A must read.

Jonathan Bloomer, Soap Creative

Third edition of this book is available

jQuery in Action is a fast-paced introduction and guide. It shows you how to traverse HTML documents, handle events, perform animations, and add Ajax to your web pages. The book's unique "lab pages" anchor the explanation of each new concept in a practical example. You'll learn how jQuery interacts with other tools and frameworks and how to build jQuery plugins. This book requires a modest knowledge of JavaScript and Ajax.

Table of Contents show full




about this book

about the authors

about the title

about the cover illustration

1. Introducing jQuery

1.1. Why jQuery?

1.2. Unobtrusive JavaScript

1.3. jQuery fundamentals

1.3.1. The jQuery wrapper

1.3.2. Utility functions

1.3.3. The document ready handler

1.3.4. Making DOM elements

1.3.5. Extending jQuery

1.3.6. Using jQuery with other libraries

1.4. Summary

2. Creating the wrapped element set

2.1. Selecting elements for manipulation

2.1.1. Using basic CSS selectors

2.1.2. Using child, container, and attribute selectors

2.1.3. Selecting by position

2.1.4. Using custom jQuery selectors

2.2. Generating new HTML

2.3. Managing the wrapped element set

2.3.1. Determining the size of the wrapped set

2.3.2. Obtaining elements from the wrapped set

2.3.3. Slicing and dicing the wrapped element set

2.3.4. Getting wrapped sets using relationships

2.3.5. Even more ways to use a wrapped set

2.3.6. Managing jQuery chains

2.4. Summary

3. Bringing pages to life with jQuery

3.1. Manipulating element properties and attributes

3.1.1. Manipulating element properties

3.1.2. Fetching attribute values

3.1.3. Setting attribute values

3.1.4. Removing attributes

3.1.5. Fun with attributes

3.2. Changing element styling

3.2.1. Adding and removing class names

3.2.2. Getting and setting styles

3.3. Setting element content

3.3.1. Replacing HTML or text content

3.3.2. Moving and copying elements

3.3.3. Wrapping elements

3.3.4. Removing elements

3.3.5. Cloning elements

3.4. Dealing with form element values

3.5. Summary

4. Events are where it happens!

4.1. Understanding the browser event models

4.1.1. The DOM Level 0 Event Model

4.1.2. The DOM Level 2 Event Model

4.1.3. The Internet Explorer Event Model

4.2. The jQuery Event Model

4.2.1. Binding event handlers using jQuery

4.2.2. Removing event handlers

4.2.3. Inspecting the Event instance

4.2.4. Affecting the event propagation

4.2.5. Triggering event handlers

4.3. Putting events (and more) to work

4.4. Summary

5. Sprucing up with animations and effects

5.1. Showing and hiding elements

5.1.1. Implementing a collapsible list

5.1.2. Toggling the display state of elements

5.2. Animating the display state of elements

5.2.1. Showing and hiding elements gradually

5.2.2. Fading elements into and out of existence

5.2.3. Sliding elements up and down

5.2.4. Stopping animations

5.3. Creating custom animations

5.3.1. A custom scale animation

5.3.2. A custom drop animation

5.3.3. A custom puff animation

5.4. Summary

6. jQuery utility functions

6.1. Using the jQuery flags

6.1.1. Detecting the user agent

6.1.2. Determining the box model

6.1.3. Detecting the correct float style to use

6.2. Using other libraries with jQuery

6.3. Manipulating JavaScript objects and collections

6.3.1. Trimming strings

6.3.2. Iterating through properties and collections

6.3.3. Filtering arrays

6.3.4. Translating arrays

6.3.5. More fun with JavaScript arrays

6.3.6. Extending objects

6.4. Dynamically loading scripts

6.5. Summary

7. Extending jQuery with custom plugins

7.1. Why extend?

7.2. The jQuery plugin authoring guidelines

7.2.1. Naming files and functions

7.2.2. Beware the $

7.2.3. Taming complex parameter lists

7.3. Writing custom utility functions

7.3.1. Creating a data manipulation utility function

7.3.2. Writing a date formatter

7.4. Adding new wrapper methods

7.4.1. Applying multiple operations in a wrapper method

7.4.2. Retaining state within a wrapper method

7.5. Summary

8. Talk to the server with Ajax

8.1. Brushing up on Ajax

8.1.1. Creating an XHR instance

8.1.2. Initiating the request

8.1.3. Keeping track of progress

8.1.4. Getting the response

8.2. Loading content into elements

8.2.1. Loading content with jQuery

8.2.2. Loading dynamic inventory data

8.3. Making GET and POST requests

8.3.1. Getting data with jQuery

8.3.2. Getting JSON data

8.3.3. Making POST requests

8.4. Taking full control of an Ajax request

8.4.1. Making Ajax requests with all the trimmings

8.4.2. Setting request defaults

8.4.3. Global functions

8.5. Putting it all together

8.5.1. Implementing the flyout behavior

8.5.2. Using The Termifier

8.5.3. Room for improvement

8.6. Summary

9. Prominent, powerful, and practical plugins

9.1. The Form Plugin

9.1.1. Getting form control values

9.1.2. Clearing and resetting form controls

9.1.3. Submitting forms through Ajax

9.1.4. Uploading files

9.2. The Dimensions Plugin

9.2.1. Extended width and height methods

9.2.2. Getting scroll dimensions

9.2.3. Of offsets and positions

9.3. The Live Query Plugin

9.3.1. Establishing proactive event handlers

9.3.2. Defining match and mismatch listeners

9.3.3. Forcing Live Query evaluation

9.3.4. Expiring Live Query listeners

9.4. Introduction to the UI Plugin

9.4.1. Mouse interactions

9.4.2. UI widgets and visual effects

9.5. Summary

9.6. The end?

Appendix A: JavaScript that you need to know but might not!


About the Technology

A really good web development framework anticipates your needs. jQuery does more—it practically reads your mind. Developers fall in love with this JavaScript library the moment they see 20 lines of code reduced to three. jQuery is concise and readable. Its unique “chaining” model lets you perform multiple operations on a page element in succession, as in $(“div.elements”).addClass(“myClass”).load(“ajax_url”).fadeIn()

What's inside

  • Countless practical examples
  • DOM manipulation and event handling
  • Animation and UI effects
  • Painless Ajax
  • Based on jQuery 1.2

About the reader

This book requires a modest knowledge of JavaScript and Ajax.

About the authors

Bear Bibeault is a web application architect for an Austin startup, and a JavaRanch senior moderator. He is the coauthor of Manning's jQuery in Action, Ajax in Practice and Prototype and Scriptaculous in Action.

Yehuda Katz is a developer with Engine Yard. He heads the jQuery plugin development team and runs Visual jQuery.