JQuery is a Javascript library which is used extensively for client side validation and manipulation of Dom elements. It is a light weight, cross browser compatible and is a repository of many reusable Javascript functions. To learn JQuery, we should have awareness of Html, CSS and Javascript.

The jQuery library contains the following features:
  • HTML element selections and manipulations
  • CSS manipulation
  • HTML event functions
  • JavaScript Effects and animations
  • HTML DOM traversal and modification
  • AJAX
Adding JQuery to a page :

The jQuery library is stored as a single JavaScript file, containing all the jQuery methods.

It can be added to a web page with the following mark-up:

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

Please note that the <script> tag should be inside the page's <head> section.

jQuery syntax :

Basic syntax is: $(selector).action()
  • A dollar sign to define jQuery
  • A (selector) to "query (or find)" HTML elements
  • A jQuery action() to be performed on the element(s)
Examples:

$(this).hide() - hides current element
$("p").hide() - hides all paragraphs
$("p.test").hide() - hides all paragraphs with class="test"
$("#test").hide() - hides the element with id="test"
$("p").css("background-color","yellow");

jQuery Events

Here are some examples of event methods in jQuery:

$(document).ready(function) Binds a function to the ready event of a document
(when the document is finished loading)
$(selector).click(function) Triggers, or binds a function to the click event of selected elements
$(selector).dblclick(function) Triggers, or binds a function to the double click event of selected elements
$(selector).focus(function) Triggers, or binds a function to the focus event of selected elements
$(selector).mouseover(function) Triggers, or binds a function to the mouseover event of selected

JQuery updates and downloads :

jQuery.com has all the updates. JQuery is available in two flavors Minified (for production) and Uncompressed (for development and testing). Current version of JQuery is 1.6.2. We can download JQuery file and place it on our application folder and just mark a reference to JQuery file within the html file to make it work.

If you don't want to download JQuery, you can directly use hosted JQuery library from Google or Microsoft CDN.