The jQuery Library

The Write Less, Do More Javascript Library for Web Developers

The jQuery Library

Meet jQuery
When I first heard about jQuery, I heard that it was a Javascript library that allowed you to chain and invoke several methods in one line of code. This chainable approach did not get my attention at first, as I was not impressed with the idea of calling several methods on one line. But it was not until I had seen the following online movie (created by John Resig) that really opened up my eyes to the true power of the jQuery library:


jQuery Demo - Expandable Sidebar Menu from John Resig on Vimeo.

What can jQuery do for you?
With just a few lines of jQuery code you can perform complex tasks that would normally take you sometime to figure out. Here’s a short list of some of the things that you can do with jQuery:

  • Develop web applications in half the time with the jQuery library
  • Handle Ajax client/server calls and events
  • Handle Browser Events
  • Easily traverse HTML and XML documents.
  • Use CSS selectors to quickly access any element inside the HTML DOM
  • Perform animations such as slides, fades, blinds, puff, etc.
  • Write Less, Do More with jQuery’s chainable and easy to use methods
  • Quickly convert an element into a jQuery component using any one of hundreds of plugins that are available on the Internet.

Getting Started
There’re a lot of tutorials and manuals available for the jQuery library but I’ll just quickly walk you through the stages required to build your jQuery enabled first web page.

First you will need to download the jQuery Javascript library from the jQuery website http://jquery.com/.

Note: You can download either the minified, pack or uncompressed version of the library but I would recommend that you download the uncompressed version, so you can later have a look at the source code.

Next, rename the downloaded file to jquery.js and copy the it to a folder on your hard disk or website.

Create or edit a web page that you want to include the jQuery library and include the jquery.js file as follows:

<script type="text/javascript" src="path/to/jquery/jquery.js"></script>

Now you’re ready to try the Live Examples at the jQuery website.

Online Tutorials

Stay tuned to this website for upcoming jQuery Tips and Tweaks. You can subscribe to this blog feed by Email or using an RSS reader.

Write a comment

  • Required fields are marked with *.

If you have trouble reading the code, click on the code itself to generate a new random code.
Security Code:
 
xwisdom
Posts: 2
Comment
jQuery vs Mootools and Prototype
Reply #2 on : Mon June 02, 2008, 21:33:09
Hi Alix,

I'm glad to hear that you will be giving jQuery a try. Nne out of every ten developers that I have introduced to jQuery just fell in love with it!

I have used MooTools and Prototype in the past, and I do believe that they are very good libraries but I believe that jQuery is in a class by itself.

jQuery is much easier for first time wed developers to get started with Javascript but the library is also powerful enough to give professional wed developers a platform to build on.
Alix Axel
Posts: 2
Comment
http://www.alixaxel.com/
Reply #1 on : Fri May 30, 2008, 21:17:55
I've been ignoring jQuery but after seeing this tutorial is seems like I'll be giving jQuery a shot.

What do you think of other JS libraries such as prototype or moo? How well do they compare to jQuery?