Why to and How use to jQuery?

        Here I will talk about jQuery, a very useful javascipt library. I will tell you why to use jQuery and how to use jQuery.
First and very important thing about jQuery , that even you will find first on jquery.com, is that it is NOT a programming language but simply a JavaScript Library.
If you want to use it, just go to their site and download appropriate .js file. You can download either production version or Development one for you. See which one suits for you...

•   Production Version is lesser in size, but its content is not readable so you almost can't modify it. If you don't want to modify it, use this version, as this will reduce page load time. This will have "min" it's .js file name.
• Development version is quite larger in size and in editable format. So on other way if you want to modify this, you will go for this version.

Why to jQuery?

There are five main reasons for selecting jQuery.

1. It is simple to use. We need to write less code and it does more(as they say).
2. Great support from forums and easy documentation.
3. Ajax support.
4. jQueryUI can be used very easily to develop very good User Interface Components.
5. Large very large actually, Number of Plugins are available, that would help you do lot more things in easy way. Plugins are available from simple ToolTip plugins to complex Image Viewer to Great Menu Structures.

And i have stated these reasons in ascending order of importance...

Plugins are very useful, you will thank them a lot when you will be in need..

How to jQuery ?

After going through why to use jQuery let's see how to use jQuery.
The basic syntax for jQuery Statement is 

 $(Selector).event();

As this is javaScript library , all jQuery lines comes under 

<Script>

</Script> tag or separate .js file.

It is always safe to write jQuery code under following function

$(document).ready(function(

{

//code here

}));

this is also jQuery statement, meaning, execute following code only after document is ready means document's DOM structure is ready.

This ready is different than onload function of javascript, ready is when whole DOM structure of HTML document is ready, and onload is when entire content, including all images on the page, is loaded in the browser.

Main purpose of jQuery is to travel through elements on the page, assign some event handlers for them and perform some action on them.

Selectors :

There are many selectors of different form,

• Few allow you to select elements by their attributes, those of [] form.
• Select multiple elements.
• Select by class or id value.
• Few of ":" type allow you to filter the set by some way like for example :first would select first element of the preselected set of elements.
• Few playing with parent child relationships.

Events :

Events allow you to subscribe some event handles for some of the event types on some elements. Events like .click(),  .mouseover() , .focus(),  keydown() are handy.

Also there are many methods to bind particular even customized events with handlers like .bind(type , data , function), on(type,selector,data,function)  etc.

Effects :

There are many methods to apply great variety of effects to selected elements.

Ex. .css(attributes) allow you to change css properties of the elements.

.addClass(class),  .toggleClass(class)

.show()  ,  .hide(speed)

.slideDown()

.animate()

.fadeIn()  ,  .fadeOut().

and many more, and many with overloaded forms with different parameters.

Manipulation :

There are many ways you can manipulate the elements and contents of them.

Ex. .append(content) 

.after(content)

.wrap(html)

.replaceWith(content)

.empty()

.clone()

Traversing :

Few of them allow you to travel through the documents with some relations. Like for example 

.parent()    .nextAll()   .each(f)  .children() etc.

Ajax :

There is great deal of support for ajax in jQuery. At this point it's adequate to just know that it DOES support ajax with methods like.
.ajaxComplete(c)
.ajaxStart(c)
$ajax( options ) etc.


And don't forget this one jQuery Complete Cheat Sheet .