Learning jQuery

Introduction and Caveat

I'm sure that some of you were expecting this entry to discuss traversing the DOM using jQuery methods. After all, I said I would do just that in my last entry. But a couple nights ago, I had the impulse to try a "live comment preview," so I'm going with it. My next entry, then, will be "How to Get Anything You Want - Part 2." I promise.

Please keep in mind as you read through this tutorial the "learning" part of this site's title: I'm learning jQuery just as many of those who will read this entry are. I mention this now because I have the nagging feeling that it was just too easy to create the live preview. Surely I must be doing something wrong. As always, I am counting on the superior knowledge of my readers to point out where my code fails. But enough of the apologies. Let's get started.

Quick Setup

For the live preview I started with the default comment form in WordPress's Kubrick template:

The important part here is the textarea's id="comment". We want to show the contents of that textarea as the user inputs them.

Create the Preview DIV

Now on to the jQuery code. Read the rest of this entry »

With jQuery, you can get to just about anything on a web page. In this entry, I'll show you a few ways you can use jQuery's versatile selector expressions to traverse to an element — or group of elements — in the DOM.

I've put together a short paragraph and an ordered list scattered with inline elements such as <em>, <code>, and links. It's all wrapped in a DIV with an ID of "jqdt," which allows me to focus the demonstration to one area of this page.

One of the first things I want to know when I try out a new programming language or library or framework is where I can find documentation and support. Yet too often I have found an otherwise promising new tool to be nearly useless for someone like me who is just starting out and can't immediately absorb all of the functionality just by looking at source code.

The excellent documentation is one of the things that first attracted me to jQuery, and with the release of 1.0 (we're now at 1.0.3) the API is baked right into the uncompressed jQuery source code comments. As helpful as this is, however, there may be times when new jQuery users need even more help. So, here is my list of useful resources for great information.