A Brief Overview of jQuery

Yes, I admit it. I hated writing JavaScript code, and even more I hated the pain that goes along with dealing with different browsers using a large quantity of script code, but thanks to a recently gained better understanding of JavaScript and a small JavaScript client library called jQuery.

I have tested number of different libraries but the one that really grabbed me is jQuery. This is a relatively small library that is based on a few very simple principles.

To me jQuery library strikes the right balance between size, feature set and ease of use.

It’s also made me much more productive and more confident in being able to tackle complex user interface and front end logic in JavaScript reliably.

So what is jQuery exactly?

jQuery is a cross-browser JavaScript library designed to simplify the client-side scripting of HTML. jQuery 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.

jQuery will help you keep the file size down, create scripts faster and keep your code smaller. 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 Library Features

  • HTML element selections functions
  • HTML element manipulation
  • Events
  • CSS manipulation
  • Effects and animations
  • HTML DOM traversal and modification
  • Ajax
  • Extensibility
  • Utilities: such as browser version and the each function
  • JavaScript plugins

Where to Download jQuery?

jQuery is free to download and use, and is dual-licensed under the MIT and GPL licenses. Two versions of jQuery are available for downloading: Minified and Uncompressed (for debugging or reading).

  1. Minified Version
  2. Source Version – Uncompressed

This library has jQuery function that you can embed to your scripts.

How to use jQuery Library?

The jQuery library is stored as a single JavaScript file, containing all the jQuery methods. It can be included within a web page using the following mark-up:

<html>
<head>
<title>My first jQuery page</title>
<script type="text/javascript" src="jquery-1.6.2.js"></script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph</p>
</body>
</html>

Note: The <script> tag should be inside the page’s <head> section.

Downloading Alternatives

If you don’t want to store the jQuery library on your own computer, you can use one of the following CDN hosted jQuery libraries,

Google Ajax API CDN

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>

Microsoft CDN

<head>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.2.min.js"></script>
</head>

Personally, I prefer to have local copies of my libraries available so I am not dependent on an online resource if my connection is down or if I’m offline for example. I tend to use local scripts and sticking them into a scripts folder of my Web application.

Conclusion

  • 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 Closing

What can we expect from jQuery? Discuss in the comments and have fun trying out all the features and lets fill the web with some nice jQuery User Interfaces!