What Is jQuery?

What is jQuery, and what can you do with it? This article provides a gentle introduction to jQuery and its uses.

jQuery logoIn this series of tutorials I'm going to explore jQuery — "The Write Less, Do More JavaScript Library". If you code using JavaScript then you've probably already heard of jQuery — it's by far the most popular JavaScript library in use today. For example, Microsoft, Twitter and ESPN all use jQuery on their sites.

To kick off the series, this article explains what jQuery is, and the kinds of things you can use it for.

So what is jQuery exactly?

jQuery is a library that makes it quicker and easier to build JavaScript webpages and web apps. Often with jQuery you can write a single line of code to achieve what would have taken 10-20 lines of regular JavaScript code.

jQuery is itself written in JavaScript, and comes in the form of a single .js file that you link to from your webpage. Your JavaScript code then accesses the library by calling various jQuery functions.

The jQuery library actually comes in 2 forms:

  • The uncompressed .js file is easy to read and modify, but it's around 160kb in size (at the time of writing).
  • The minified .js file has all comments, whitespace, and other unnecessary characters removed from the file, squeezing the whole library into a mere 23kb. Although you can't easily read the code, this is the version you'll want to place on your site, as it's much quicker for visitors to download.

jQuery is free to download and use, and is dual-licensed under the MIT and GPL licenses.

As well as the jQuery library itself, hundreds of jQuery plugins are available to add even more power and functionality to your scripts.

What can you do with jQuery?

jQuery makes it easy to write powerful JavaScript apps and create eye-catching animated effects rivalling those of Flash movies. Amongst other things, jQuery is great for:

  • Adding animated effects to elements. jQuery lets you easily add effects such as fading in/out, sliding in/out, and expanding/contracting.
  • Making XML (Ajax) requests. These use JavaScript to request additional data from the Web server without having to reload the page.
  • Manipulating the DOM. You can easily add, remove, and reorder content in the Web page using just a couple of lines of code.
  • Creating image slideshows. You can use jQuery effects to build nice animated slideshows and lightboxes.
  • Making drop-down menus. jQuery makes it easy to create multi-level dropdowns with animations.
  • Creating drag-and-drop interfaces. Use jQuery to build a page with elements that can be repositioned or reordered simply by dragging and dropping.
  • Adding power to forms. With jQuery you can easily add complex client-side form validation, create auto-complete Ajax text fields that pull data from a server-side database, and so on.

Sure, you can do all of the above by writing your own JavaScript, but it's so much easier just to use jQuery. Why reinvent the wheel?

Another of jQuery's strong points is that it makes it easy to write JavaScript that works on many different browsers. Incompatibilities between popular browsers such as IE, Firefox and Safari mean that you often need to write different chunks of JavaScript code for each browser. With jQuery, however, you just call the appropriate jQuery function and let jQuery deal with making the code run on different browsers. Nice!

Summary

This article has given you a brief overview of jQuery. You've learned that:

  • jQuery is a free JavaScript library.
  • With jQuery you can write powerful JavaScript apps using fewer lines of code.
  • jQuery is great for things like animations, Ajax requests, DOM manipulation, image effects, and user interface elements.
  • jQuery lets you easily write cross-browser JavaScript code.

In my next article I'll show how to get started using jQuery. Until then — have fun!

Follow Elated

Related articles

Responses to this article

2 responses (oldest first):

16-Feb-11 19:36
I have be playing around with HTML. I was looking at what jQuery was and was wondering if you could recommend a good book for a complete beginner? I would like to learn how to use jQuery.
20-Feb-11 19:21
Hi Jamesbr,

I confess I've not read any jQuery books myself, but I've heard good things about jQuery Cookbook:

http://www.amazon.com/jQuery-Cookbook-Solutions-Examples-Developers/dp/0596159773/

Matt

Post a response

Want to add a comment, or ask a question about this article? Post a response.

To post responses you need to be a member. Not a member yet? Signing up is free, easy and only takes a minute. Sign up now.

Top of Page