Is jQuery another language we have to learn?

I don’t often visit the javascript forum. Now I’ve had a quick look and I don’t know if I should be happy or terrified - every second post is about jQuery! I’m feeling slightly behind the times because I haven’t yet taken the time to follow this new trend. I work with javascript quite often, I happen to like the language and I’m coping (I think) pretty well without jQuery. I must admin I’m not a special effect fan so my javascript is more functional rather than gimmicky - for this usage I don’t feel the language is awkward or lacking in any way. Sure, sometimes I use someone else’s piece of code or snippet (and my own of course) to ease my work but I am unsure as whether it’s worth the effort to learn jQuery. I imagine I could gain a few minutes here and there after I have mastered it but I’m afraid sometimes bugs can be harder to track down when using a library, which would even things out. I’m afraid of losing the total control I now have over execution of my scripts.

What are your experiences? Is jQuery a must? I’m afraid the popularity has almost made it so today…

It’s not a must, but it’s certainly very handy. If you have javascript experience and know CSS (preferrably also a bit of CSS3) just reading a few jQuery tutorials should you get you up to speed in a week or so; jQuery is not very hard to learn.

I too used to write all my scripts myself for the same reason you do: full control. However, after switching to jQuery I really don’t feel I’ve lost that control, but rather now have control on a whole other level.

As for bugs, there hardly aren’t any. Every version of jQuery that is released undergoes heavy testing. I’ve personally only found one bug in jQuery (related to AJAX not working in IE) but I’m now really starting to wonder if I somehow got a faulty jQuery version somewhere because I’ve never heard that complaint from others.

As an example of pure javascript vs jQuery: if I were to hide all LI elements in an UL with the id “menu” that are visible and have a class of “hideme” I would have to use several for loops and if statements in pure javascript, while in jQuery it’s just


$('#ul li.hideme:visible').hide();

I’m sure you’ll agree that that’s very readable.
It certainly took me a lot less time to write than writing it all out in pure javascript :slight_smile:

jQuery is only a code library that simplifies many common tasks, and takes care of many browser incompatibilities.

Consider this normal standard javascript function, and how it’s used:


var clickHandler = function (func) {
    return function (evt) {
        evt = evt || window.event;
        var targ = evt.target || evt.srcElement;
        if (targ.nodeType === 3) { // handle Opera bug
            targ = targ.parentNode;
        }
        func.apply(targ, [evt]);
    };
}

document.getElementById('prev').onclick = clickHandler(function (evt) {
    // do stuff with this and evt
    ...
});

Where the element is referenced by the this keyword

Well with the jQuery library (it’s not a different language, after all), all of the above code is just replaced by:


$('#prev').click(function (evt) {
    // do stuff with this and evt
    ...
});

That’s mostly what jQuery is used for - to abstract away the difficulties and problems inherent in supporting different browsers and situations, so that you can get on with the job of scripting.

Okay, that just sounded like a sales pitch, but that’s my understanding of the situation.

It is just a JavaScript library written in JavaScript. If you are sufficiently familiar with JavaScript to be able to use it properly then you may have your own library of equivanelt functionality that you use instead. Alternatively you could always just pull out the parts of the library that you actually need to use if you only need a small part of the functionality.

Used correctly where your site needs to use a significant fraction of the functionality jQuery provides makes it well worth the effort of learning it but if you only need a small part of the functionality you are probably better off to use your own code.

There are lots of people who misuse jQuery. I have seen pieces of jQuery codewhich (excluding the jQuery library itself) are much longer than the JavaScript code to do the same thing. That usually happens when someone tries to use jQuery without knowing enough JavaScript first.

I’ve been using JavaScript for about 6 years and about a year ago I tried jQuery - and I was very skeptical about it since I thought I won’t have control over what I do and that things will get messy quickly.
And I was so terribly wrong. Today, I can’t imagine working without jQuery (and jQuery UI is simply amazing piece of work).

If you’re familiar with JS, it’ll take mere hours to get familiar with jQuery. It’s that intuitive. CSS-like selectors are a work of genius. Your development time will cut down significantly, I am willing to bet on my statement how much I’m sure of it.
The jQuery UI is also amazing piece of work, the amount you can achieve within minutes is simply amazing. I know I sound like a “fan boy”, but I really haven’t been impressed with something to the same extend for many years.

Thanks for responses, there were some good points presented. I’m aware that learning jQuery wouldn’t take much time for me but so far I’ve been putting it off. I’ll definitely give it a try. I’m aware that some things could be made simpler in javascript and I wish they were. I think the best that could happen would be for most of jQuery features to be implemented in javascript core - maybe that will happen in the future?

How about compatibility with less common browsers? I’ve read jQuery can have problems with Konqueror. What about mobile devices? There is an online shop I’ve made and the shopping cart uses javascript a lot for various on-the-fly calculations, showing/hiding options, manipulating form fields, etc. and I was pleasantly surprised to see my cheap and simple sony ericsson mobile phone working perfectly with all that stuff (the built-in browser) - sure the page display looked very awkward on such a small screen but all the features were working. I wonder if they worked so well if I used jQuery.

The way a page should normally be put together, is for the lowest-common denominator to be able to use it without any fancy bells and whistles. This means getting it working without javascript, where the server-side performs validation and all of the form actions. Only after which would you implement javascript to show/hide things, and to reduce the amount of travel to and from the server.

When it comes to mobile devices, one common working solution is to build the page so that it is usable by the least capable mobile browser, and to then use @media queries and other techniques to provide support for more capable devices, up to and including full-on desktop-based web browsers. There’s more info on that in the rethinking the mobile web presentation.

Some of the staff here are in the process now of digging through the different resources out there about mobile development. You can expect to see some resources relating to them turn up over the course of the year.