Thursday, August 16th, 2007

jQuery for JavaScript programmers

Category: jQuery

<p>Simon Willison has followed up his jQuery presentation with his thoughts on jQuery should be of interest to experienced programmers.

He admits to having a different view of jQuery at first:

Over the past few months it’s become clear to me exactly how wrong I was. jQuery is an exceptionally clever piece of engineering. It neatly encapsulates an extraordinary range of common functionality, and provides a clever plugin API for any functionality not included by default. It takes a core abstraction—that of a selection of DOM elements—and extracts as much mileage out of it as possible. Most importantly, it does so in a way that obeys best practices and plays well with other JavaScript code.

He then goes into what he likes about jQuery with:

  • Namespacing: Care.
  • The infamous $ function
  • Selecting some elements: At the core
  • Doing stuff with them
  • Chaining:
    javascript
    < view plain text >
    1. $('form#login')
    2.     // hide all the labels inside the form with the 'optional' class
    3.     .find('label.optional').hide().end()
    4.     // add a red border to any password fields in the form
    5.     .find('input:password').css('border', '1px solid red').end()
    6.     // add a submit handler to the form
    7.     .submit(function(){
    8.         return confirm('Are you sure you want to submit?');
  • DOM manipulation:
    javascript
    < view plain text >
    1. var div = jQuery('<div>Some text</div>').addClass('inserted').attr('id', 'foo');
  • Handling events:
    javascript
    < view plain text >
    1. jQuery('p').one('click', function() { alert(jQuery(this).html()); });
  • Unobtrusive scripting:
    javascript
    < view plain text >
    1. jQuery(function() {
    2.     alert('The DOM is ready!');
    3. });
  • jQuery and Ajax:
    javascript
    < view plain text >
    1. jQuery.getJSON('/some.json', function(json) {
    2.     alert('JSON rocks: ' + json.foo + ' ' + json.bar);
    3. }); // Retrieves and parses /some.json as JSON
  • Plugins: Easy to write, hence many of them.

Related Content:

Posted by Dion Almaer at 6:07 am
11 Comments

+++--
3.1 rating from 68 votes

11 Comments »

Comments feed TrackBack URI

Don’t u get tired to collect articles about the features of jQuery … repeating them makes it not more interesting.
My opinion is, that jQuery is not for experiences JavaScript programmers because it does not provide many methods exceeding DOM manipulation, like OOP, more Array/String methods, Hash … (consistent naming, whats a method “one” that adds an event?) It’s ok for starters and people that want to avoid coding actual JavaScript ;) … I already hear the screams of all devotees.

Comment by mike — August 16, 2007

Perhaps it is covered a bit, but it is a very good framework that providers excellent cross-browser features in a very tight package. I use it to manipulate the markup and bind events and it works great. I also use the limited visual effects it provides. And lately I have been using the plugins that extend jQuery. The plugin system is the biggest to consider using jQuery. I easily add drag&drop support as well as context menus to my application so easily. There is no reason to use other bloated libraries. Just because it does not do everything is not a negative. That is a very good thing. If I need anything more I can create a plugin. I also think jQuery supports OOP very well.

Comment by Brennan Stehling — August 16, 2007

@mike: If you put your personal bias aside and look at the categories on the left-hand side of Ajaxian, you’ll see that jQuery has only recently begun to get more coverage and thats because of the great strides its made of late. Even though I use jQuery and I’m a member of the project team, I never get tired of seeing Prototype, Ext, Dojo or Mootools postings because it allows me to keep up to date with what other projects are doing. Please try to be a little more objective about things.

Comment by Rey Bango — August 16, 2007

@Mark:
jQuery does add very useful Array and String methods, see:
$.map, .filter, .grep, .trim, .merge
And there is also .extend for further methods and plugins.
jQuery does NOT extend the default Array and String objects to avoid namespace collisions and conflicts with properties like .length.
jQuery is easily extensible with plugins, for issues like AJAX location.hash tracking (see History/Remote plugin) but you can also create a hash from an array, see the very long list at http://docs.jquery.com/Plugins .
jQuery is for programmers who are tired of cross-browser headaches and don’t need the default bloat of other frameworks, but is so easily extensible that you can very easily add many features.
It is very OOP-focused (have you ever seen the source?) and good coding practices are encouraged – just watch the advice given to plugin authors on the jQuery-en group.
The importance of this article is not just jQuery, but the support of a programmer widely respected in the field. I can see we need to continue posting articles on the power of jQuery, because some coders (ahem) have not paused to see how much time and effort they can save with a few simple lines of jQuery code.
Is there a framework, or set of extended methods, that you would rather recommend?

Comment by Charles — August 16, 2007

oops… ‘Mark’.replace(“ark”,”ike”)

Comment by Charles — August 16, 2007

Thanks for the mention of the great framework. Professionally it may not work for the experienced users but future is clear upon the extra necessary work on jQuery to hit the professional developers.
The pure wrong decision of Resig is simply not buiding up a team of talented web personalities to work with, but stay in the personal zone.
But still it’s one of the simpliest and good working Javascript frameworks all time and deserves the buzz.

Comment by Burcu — August 16, 2007

@Burcu: I work alone? That’s news to me! The jQuery team is about 25 people strong (about fifteen working on the jQuery project and another ten working on the new jQuery UI project).

The jQuery core team is about three consistent core committers (of which I am one) and we receive hundreds of patches which we work back into the core system (not to mention all the other contributors who contribute whenever they can).

I actively drive and manage the project, so I’m not sure if you’re suggesting that I give up my roll in that regard, or not. Of course, it would be nice if we were able to spawn off a whole jQuery foundation, but that remains to be seen.

More information:
http://docs.jquery.com/Contributors

Comment by John Resig — August 16, 2007

@Resig
Not sure he meant that you work alone. Rather that you work with evangelists. Which is not, persay, a bad thing. He just mentioned that some are not professional. I’ve noticed, for instance, that Rey Bango likes to leave a comment on just about any blog/article that mentions jQuery. I guess that’s his job, but I frown on the fact that there’s big brother watching what people say. I agree that he has the right of an opinion, but to lecture people… that’s rude.

Comment by anonymous — August 17, 2007

@anonymous: You’re right in that my responsibility is to promote jQuery and I do so in a VERY professional manner. And yes, I am vigilant about jQuery topics and will reply to incorrect information. Its no different from countless other folks that are passionate about specific topics and want to ensure that the *correct* information gets out. I bet you would be hard pressed to find any reply where I’ve been rude to anyone. At the end of the day, what you’re telling me is that you want the freedom to post whatever you want about jQuery (or any other topic) and not have to deal with a rebuttal. That’s actually more “big brother-ish” than what you’ve mentioned. Finally, since we’re on topic of rudeness, something that I think is extremely rude is hiding behind the veil of anonymity to voice an opinion.

Comment by Rey Bango — August 17, 2007

Personally, i think jQuery has come a long way… and i do agree that it is a great framework. But i would not call it a framework for JavaScript programmers. Or, at least not for JavaScript prgrammers who have dealt with other programming languages. I would (and do) recommend it to website interface designers and developers who don’t want to know the inner workings of making things happen on their web pages. They just want an easy way to add interactivity and usability to their pages. I think what you have done is great, and obviously the JavaScript community agrees.

Since i was a programmer before i was a web-programmer, I prefer a modular framework that gives me the flexibility and power to use JavaScript as if it was, for lack of a better term a ‘real’ programming language like C++ or Java. I want a JavaScript toolkit that will allow me to apply my previous knowledge of object oriented programming and design patterns to the web. As long as everyone is happy, there is no need to criticize each others work, just respect it for what it is and make the web a better place.

-cheers :)

Comment by Tom Occhino — August 17, 2007

Disclaimer: I am a jQuery contributor.

Re: jQuery in professional use:
http://docs.jquery.com/Sites_Using_jQuery

Assumptions get everyone nowhere.

Comment by Bradley — August 17, 2007

Leave a comment

You must be logged in to post a comment.