Digital Web Magazine

The web professional's online magazine of choice.

jQuery Crash Course : Comments

By Nathan Smith

October 8, 2007


Nate Klaiber

October 9, 2007 6:39 AM

Excellent article with a very interesting sample piece. I like that you didn’t stick with something extremely simple and showed many aspects of the power of jQuery. Obviously, even with this example, you have only scratched the surface of the possibilities – but you sure did cover a good amount of ground in regards to is syntax, methods, and chainability.

Nice work. So, you starting a new airline company?


October 9, 2007 7:46 AM

Great Read. I think this article actually does a better job articulating the why should I use, ease of use, and the power of using jQuery than jQuery’s actual site. I wish this article had been written when I was first getting started with jQuery, and JS libraries in general.

Karl Swedberg

October 9, 2007 8:22 AM

This is a fantastic tutorial. As Nate mentioned above, it’s great that the example has some complexity to it. The whole thing — both the article and the demo — appear very polished. Clearly a lot of work went into this. Well done!

Sean O

October 9, 2007 8:24 AM

Nice article. As for the last section — using JS to interact with forms — see Mike Alsup’s excellent Form plugin for jQuery:

It’s the first place to start (IMHO) when building an interactive Web App with jQuery.

Shaun A

October 9, 2007 9:07 AM

Great article. Nathan’s removed any apprehension I may have had undertaking a move out of the designer’s chair and into making things happen on the page.

Nathan Smith

October 10, 2007 6:57 AM

@Nate Klaiber: Haha, no. I’m not actually going into the airline business. Far too many headaches in that industry.

@Sean O: Agreed, Mike’s jQuery form plugin is amazing.

Wei Dai

October 14, 2007 6:30 AM

Great article! Simple but clearly sorted out! It made me very eager to learn more about jquery. It is a very good article for newbie to know about jquery!

Jason G

October 18, 2007 7:46 AM

And airline example in an article called “crash course.”

Interesting choices. :-)

Matthew Pennell

October 18, 2007 11:06 PM

“The greatest thing is style — a mark of genius, for to make good metaphors implies an eye for resemblances.” – Aristotle.


Chris Crunch

October 29, 2007 9:10 PM

Awesome tutorial.
Too often i find online tutorials leaving me unsatisfied, only scratching at the surface of their topic – but here is some meat and bones, showing a practical and complex example of the different ways to approach a realistic subject.
Digital web comes up trumps again, putting value into the content.

Thank you!

Danny Wachsstock

November 3, 2007 9:42 PM

Does this actually work?
It looks like thisRow is a jQuery object, but the next lines are using it like a DOM array.

var thisRow = $('#passenger_details tr');

for (var i = 0, j = thisRow.length; i < j; i++){

if (thisSeat == thisRow[i].className) {

Matthew Pennell

November 4, 2007 1:35 AM

Danny: A jQuery object still has a length property (to allow you to count the number of matching elements), and can be treated as a DOM node in certain ways.

Danny Wachsstock

November 4, 2007 3:26 AM

Thanks. You, of course, are right. I’ve been using jQuery long enough that my brain automatically does things like thisRow.each(function(){ this.className...}) that I forgot that a jQuery object is an array of DOM elements, at least since 1.2 or so…

I still use $(...)[0] to get the first element; I just never think about using the rest of the array…
Does anyone know if each is that much slower?

Danny Wachsstock

November 4, 2007 6:12 AM

Looks like textile ate my comment.
I meant to say that I use $(..)[ 0 ] to get the first element


November 14, 2007 5:26 AM

It’s a much more practical tutorial than many others I’ve seen, but I can’t help thinking that while it undoubtedly does show off some of the beauty of jQuery, the huge 240KB footprint (mostly HTML) of the final page doesn’t exactly scream “best practice”!

Nathan Smith

November 17, 2007 7:07 PM

Marcus: Good point. The page could’ve been lighter, with Ajax calls to fill in some of the more dynamic functionality. At that point though, there’s sacrifice on accessibility. It’s a balancing act, and for the sake of the demo I made it all one HTML page.

Sorry, comments are closed.

Media Temple

via Ad Packs