Want to read Slashdot from your mobile device? Point it at m.slashdot.org and keep reading!


Forgot your password?

Learning JQuery 1.3 153

Michael J. Ross writes "Of all Web technologies, JavaScript may have the most checkered past — first heralded as a powerful object-oriented language for jazzing up Web pages, but later condemned as a source of spammy pop-up windows and horrid animations polluting websites everywhere. Yet during the past several years, Web designers and developers are increasingly using JavaScript unobtrusively, for client-site interactivity — as a supplement to server-side functionality, not a replacement, and built upon standards-compliant (X)HTML and CSS. As a result, the once-derided language is now enjoying a true resurgence in interest and use. This has been bolstered by the proliferation of JavaScript libraries, of which jQuery is clearly the front runner. Web programmers seeking to get up to speed on this exciting resource can turn to Learning jQuery 1.3: Better Interaction Design and Web Development with Simple JavaScript Techniques." Keep reading for the rest of Michael's review.
Learning jQuery 1.3
author Jonathan Chaffer, Karl Swedberg
pages 444 pages
publisher Packt Publishing
rating 9/10
reviewer Michael J. Ross
ISBN 978-1847196705
summary A detailed introduction to this popular JavaScript library.
Written by Jonathan Chaffer and Karl Swedberg — two veteran Web developers based in Grand Rapids, Michigan — Learning jQuery 1.3 was published on 13 February 2009, under the ISBN 978-1847196705, by Packt Publishing, which kindly provided to me a copy of the book for review. There is a publisher's Web page for the book, where readers can order print or PDF versions of the book (or both, at a sizable discount); contact Packt Publishing with questions or feedback; read more information about the book, the authors, and the table of contents; and download a free sample chapter (the fourth one, titled "Effects") in PDF format. Readers who want to follow along with the authors' discussion, should note that all of the sample code used in the book can be downloaded from its support page. There is also a link for reading the reported errata, of which there are eleven, as of this writing. (The erratum for page 40 is incorrectly listed twice.)

The book begins with a foreword by John Resig, the creator of jQuery. What follows is over 400 pages of information, organized into eleven chapters and four appendices, covering all of the major topics related to jQuery, after a quick-start chapter: selectors, events, effects, DOM manipulation, AJAX, tables, forms, shufflers and rotators, plug-ins, online resources, development tools, and closures. The book has all the ingredients to serve as a full introduction to jQuery for experienced Web programmers, because it assumes no prior knowledge of jQuery (or any other JavaScript libraries); but it does assume that the reader comprehends the basics of HTML, CSS, and JavaScript — thus not wasting time by teaching these prerequisites skills, as is attempted in some other Web programming books.

The first chapter may be brief, but it is sufficient to present the major features of jQuery, its advantages versus raw JavaScript, and a quick history of its various releases after it was first mentioned by John Resig in August 2005. In addition, the reader is shown where to obtain the library, how to add it to a Web page, and a few of its basic capabilities. In the given example, multiple HTML paragraph elements are styled using just three lines of code; yet the power of jQuery would have been demonstrated even better had the authors also shown the equivalent raw JavaScript needed to perform the same functionality.

The next four chapters present the basics of jQuery upon which everything that follows is built. Readers are introduced, in Chapter 2, to the jQuery syntax for accessing individual elements and groups of elements on a Web page, using the $() factory function, CSS selectors, and jQuery's own custom selectors. As with all of the chapters that follow, several examples are used to illustrate the core ideas. The ability to intercept and react to events on a Web page — such as a user clicking on a particular link — is an essential part of client-side interactivity, and is the topic of the third chapter. But first the groundwork is set by learning how to control when code is executed, how to utilize multiple scripts on a page, and how to use jQuery with other JavaScript libraries. Then a style switcher example is used to demonstrate the "this" keyword, shorthand event methods, and compound events, as well as event capturing, bubbling, objects, targets, propagation, delegation, namespacing, and other topics. Unfortunately, the screenshots are of little help, largely because the black-and-white images fail to show user feedback, such as green backgrounds on hover, and even bolded link text. Chapter 4, which covers jQuery effects, begins by explaining how to programmatically discover and save attribute values, for later use; then it explains how to hide and show HTML elements, fade them in and out, toggle their settings, create simple custom animations, invoke effects sequentially using queuing, and queue effects on different elements using callback functions. The fifth chapter shows how to easily add and remove elements and their attributes from the DOM, and even create a new DOM structure from scratch. Most of the sample code is well explained, except for the fourth line in the insertAfter() snippet on page 96, which is not clear at all. Also, the sample text that consumes the bulk of pages 98 and 99, should be replaced with something much shorter, partly because it would be easier to locate the "span" tags within the text. This chapter, like the previous one, concludes with a "nutshell" summary that is quite helpful — and would be even more so if it listed, next to each jQuery method, the corresponding page number.

Asynchronous JavaScript and XML (AJAX) is a combination of technologies that is seeing more widespread use every year, as developers discover the advantages of dynamic Web page interactivity without the reloading of the page each time, which of course slows down the process for the user. The sixth chapter shows how to utilize AJAX, from a jQuery perspective, with explanations and examples of the four major approaches that involve static data files, including a handy summary of when each approach would be most appropriate. Also explored are the dynamic AJAX strategies, including GET and POST requests. The authors should have mentioned that, in order to make functional the "E" and "F" dictionary entries in the example, the reader will need to load the index.html file using a Web server, and not as a static HTML file, so the calls to "e.php" and "f.php" will work. By the way, anyone confused by the reference to jQuery Reference Guide, on page 146, should be aware that it is the title of a book written by the same authors as this one.

With the seventh chapter, the authors transition from what they consider to be the tutorial portion of the book, and begin to demonstrate how the reader can utilize the earlier basics for improving Web page functionality — in this case, working with tables. The authors make good use of code snippets and screenshots to show how one can do table sorting, row striping, row highlighting, and other capabilities independent of — and in conjunction with — server-side equivalents. The subsequent chapter consists of a similar survey of jQuery goodness, but applied to forms — specifically: styling, client-side validation, auto-completion of search entry fields, and input masking (with an emphasis upon numbers). The sample HTML is a model of quality markup, except for the wrapping of checkbox input elements inside of label elements, which is noncanonical and can make it problematic to properly align all the checkboxes in a form vertically, for all browsers. Chapter 9, titled "Shufflers and Rotators," demonstrates how to create a rotator for RSS newsfeed headlines, and an image carousel featuring image enlargement with transition. Readers interested in testing out the sample code — and possibly even modifying it — should be aware that, for chapters 7 through 9, the sample code within the downloadable archive is not stored in chapter-named directories, but instead combined into an application, in the "bookstore" directory.

The last two chapters of the book are devoted to jQuery plug-ins — using those created by others, and developing one's own. In Chapter 10, to illustrate the high-level ideas, the authors focus on and recommend a number of specific plug-ins built for handling forms, advanced effects, widgets, tables, images, and charts, as well as some theming resources. In the subsequent chapter, the authors show how to develop plug-ins of varying complexity, including those that implement new global functions, implement new jQuery object methods, and extend the jQuery selector engine; the chapter wraps up with advice on how best to distribute newly-created plug-ins.

All of the chapters end with summaries, which, given the detailed and technical nature of the material within each chapter, do not add any value to the book, and could be excised without loss. The four appendices offer some valuable information: numerous online resources for readers seeking reference material; development tools for the most popular Web browsers; details on JavaScript closures; and a quick reference for the jQuery selector expressions and all of the methods. The weakest part of the book, the index, is inadequate — missing important terms, such as "animation," "callback," "iteration" (or "iterator"), and "toggling."

The following errata have yet to be listed on the book's support page: "Let[']s" (page 23), "page [is] loaded" (page 40), "if Normal was" (should read "if Normal were"; page 61), ", though" (should read "though,"; page 80), "user the $() factory function" (page 113), "slices with be" (page 283), and "though[,] there" (page 340). In the errata listed on the support page, the entry for parseFloat refers to page 74, but the error actually occurs once on page 69 and twice on pages 70, 71, and 79. In the six screenshots on pages 253 through 257, the shipping totals are incorrect. Nevertheless, the number of errata per page is far less than what is found in most computer books, especially those from Packt Publishing.

The generous amount of sample code should be quite helpful to the reader, because for most programmers, we learn best by example. However, there are many instances where a line of code is unnecessarily wrapped to a second line, even though there is plenty of room at the end of the first line to accommodate the portion of code forced down; pages 82 and 217 have glaring examples of this. The same premature wrapping is seen in some of the text, such as on pages 210 and 311.

The authors as a whole do an admirable job of explaining the central ideas. The explanations are generally clear, which is absolutely critical for a topic like jQuery that can be overwhelming to anyone unfamiliar with it — and not just as a result of the somewhat cryptic syntax (which admittedly is unavoidable), made worse by chaining and especially by the nesting of anonymous functions. Even a cursory glance through the book should make evident that the authors put a lot of effort into writing it, reflected not just in its substantial length, but also the number of examples they created for the book, and the functionality contained therein.

With its thorough coverage of key jQuery topics — from the basics to plug-in development — Learning jQuery 1.3 is an information-packed resource that can help Web developers learn how to take their JavaScript programming to the next level.

Michael J. Ross is a freelance website developer and writer.

You can purchase Learning jQuery 1.3 from amazon.com. Slashdot welcomes readers' book reviews -- to see your own review here, read the book review guidelines, then visit the submission page.


This discussion has been archived. No new comments can be posted.

Learning JQuery 1.3

Comments Filter:
  • HTML forms (Score:2, Insightful)

    by Anonymous Coward on Monday January 11, 2010 @12:19PM (#30724150)

    Client side form handling is the browsers job.

    Roll on HTML 5 [diveintohtml5.org]

  • JQuery (Score:3, Insightful)

    I looked into JQuery recently for a web project, and while it is really, really cool, it's pretty heavy if all you want is (say) a Calendar popup. I think JQuery is really useful if you are going to basically do a desktop-style application using Javascript, like a spreadsheet or other major application. If all you want is a few controls for standard web forms, JQuery is overkill and too slow to download. There are better individual choices.
  • by Anonymous Coward on Monday January 11, 2010 @12:30PM (#30724268)

    After years of doing UI development using Motif, then MFC and finally Swing and WinForms, I've ended up doing some web UI development for the past few years, mainly for business apps. It's simple enough to do, but I spend far too much of my time thinking "What the fuck?!?!" when using libraries like jQuery or YUI.

    It's pretty bad that UI programming using C, C++, Java and even VB.NET was more enjoyable and productive than using JavaScript and jQuery.

    With web UIs, we end up spending a whole lot of time getting around browser-specific problems, and many times it's just really awkward to bend our UI to the HTML or AJAX model. Often times, things that would have been really quick to do with Motif or even MFC ended up taking much longer to develop using HTML, JavaScript and jQuery.

    And the UIs don't even look that good, too. We thankfully have some pretty good graphics designers working for us, and our web apps don't look bad, but they also don't look or feel as robust as native (or even pseudo-native like Swing) apps. Some of our users tell us that they found the old Motif apps easier to work with.

    I really don't like the direction the craft is heading. We were making good progress up until Swing and WinForms, but then web development took over and it feels like we've made a serious regression. So I'm thinking about moving away from UI design and development, after 20+ years. There are other areas where they're going in the right direction. Unless I can find myself a job using Qt somewhere. That's the only toolkit that seems to be making sensible innovation these days.

  • Re:JQuery (Score:5, Insightful)

    by royallthefourth ( 1564389 ) <royallthefourth@gmail.com> on Monday January 11, 2010 @12:30PM (#30724274)
    It's only 19kb and that tiny transfer only happens once because of browser caching. It's not too big for anything.
  • by rob_osx ( 851996 ) on Monday January 11, 2010 @12:51PM (#30724554)
    The name "functional programming" implies the use of functions, yet I've seen too much "functional programming" that is just lines and lines of indented code. Here is an idea: Actually create new functions! Yes, these innovative routines can actually make the code readable and encourage code reuse! Try to make each function do one task, and code will be readable, reusable, and will not suffer from over indention.
  • by TheRaven64 ( 641858 ) on Monday January 11, 2010 @01:08PM (#30724796) Journal
    It is OO, but you did not make a new instance of a class, you made a new object. Apple is not a class, it is a closure. The semantics of the new keyword in JavaScript are the second most horrendous part of the spec. You're basically calling the closure with this bound to a new object which has Object as its prototype. A class is an object which is both a factory and a prototype. Here you have a factory, but not a prototype.
  • by Nadaka ( 224565 ) on Monday January 11, 2010 @01:08PM (#30724800)

    No. Functional programming does not just "implies the use of functions". Functional programming applies only to languages that consist of stateless atomic functions exclusively. The word you are looking for is "procedural programming"

  • by Tablizer ( 95088 ) on Monday January 11, 2010 @01:16PM (#30724946) Journal

    I think there's some "faddism" to the recent functional programming (FP) push. FP has a place, but that place is not necessarily everywhere. We learned the same lesson with OOP: some parts of our software fit it well and some don't. Use the right tool for the job. Some if it is also subjective. We all think different.

    There will be some zealots who will say, "Your entire program must use X-oriented programming or you are a lame dumb Luddite who doesn't get it. Puppies will die of cancer if you don't use only X". But these extremists will tend to fall by the wayside and people will end up using different paradigms where they work best as experience teaches when to use what.

  • by slim ( 1652 ) <{john} {at} {hartnup.net}> on Monday January 11, 2010 @01:17PM (#30724962) Homepage

    You can do functional programming in languages that don't enforce functional programming.

    The GP makes the valid point that people sometimes use anonymous functions when a named function would be clearer.

    Instead of (hypothetical language):

    myList.map({ // some complex inline anonymous function
    ... instead ...

    function transform { // some complex code


    It can increase clarity, and reduces the depth of indentation the GGP was complaining about.

  • by Mr. DOS ( 1276020 ) on Monday January 11, 2010 @01:24PM (#30725078)

    I don't have any recent experience with MooTools, but when I was at a jQuery/MooTools crossroads about a year and a half ago, I chose jQuery for two reasons:

    • JS written using jQuery was more concise and easier to read/write
    • jQuery's documentation was better (at the time, I seem to remember large chunks of MooTools documentation missing; possibly because they'd just released a new version or something, but still bad)

    And that's about it. jQuery has given me no reason to look elsewhere; it's still concise and easy-to-use, it's fairly fast, it's compatible with as many browsers as I'm willing to target for CSS, and there's a million and one plugins so often the only JS I need to write is that to enable a plugin.

          --- Mr. DOS

  • Re:JQuery (Score:3, Insightful)

    Which takes all of .16 seconds on even a low-end 512k DSL/Cable connection. Even on dialup that's not even 2 seconds (but one would question why one would be going to a javascript heavy website on dialup).

    Okay, first of all, that "512k" connection is 512 kilo-BITS. That means 64 kilo-BYTES / second. So that 80K download takes an extra one and a quarter seconds. That may not sound like much, but it adds up.

    And if the whole world was broadband, then I'd be less concerned, but a lot of the world is still on crappy dial-up connections. A typical dial-up connection is 33 Kbits or about 4K Bytes/second. That means that 80K download is 20 seconds. 20 seconds NOT EVEN RELATED TO CONTENT. Try counting off 20 seconds and see how long that really is.

    I don't know about anyone else, but I want my web pages to pop. Snap! Snap! Snap! I HATE waiting for crappy designed web pages to load, and I'm on a 16 megabit connection.

  • Re:HTML forms (Score:4, Insightful)

    by Tablizer ( 95088 ) on Monday January 11, 2010 @02:01PM (#30725626) Journal

    The problem is that HTML was originally designed for "e-brochures" more or less. It doesn't fit desktop/CRUD-style GUI's very well and people have been trying to tack that on after-the-fact with D+ results which are bloated, buggy, jittery, and version/brand-sensitive.

    In my opinion, we need a new kind of browser that is designed to handle desktop/CRUD GUI's well from the get-go. Most of the features we know and love from desktop/CRUD GUI's would be specified by mere mark-up and wouldn't have to download entire GUI system kits to emulate them. Client-side scripting would then be for rare specialized stuff it can't handle. Force-fitting is just not working well and we've been at it for more than a decade. Let's stop trying to paint stripes on a horse and just go get a real zebra.

Memory fault -- brain fried